Making a dotted grid with CSS

0 votes

I want the whole body to have a dotted grid

body {
  background-image: radial-gradient(black 1px, transparent 0);
  background-size: 40px 40px;
}

The issue is that I want to relocate it so that a dot is placed at (0, 0), which is the body's top left corner. As a result, the entire structure should be adjusted by -20px and -20px. Or do you think there's a better way?

May 30 in CSS by Edureka
• 9,800 points
15 views

1 answer to this question.

0 votes

You can use the background-position CSS property to do exactly what you were thinking.

body {
  background: white;
  background-image: radial-gradient(black 1px, transparent 0);
  background-size: 40px 40px;
  background-position: -19px -19px;
}

 

answered May 31 by Edureka
• 9,540 points

Related Questions In CSS

0 votes
1 answer

What is the proper way to display a logo with CSS?

An <img> element is the proper way ...READ MORE

answered Jun 10 in CSS by Edureka
• 9,540 points
28 views
0 votes
1 answer

Change a HTML5 input's placeholder color with CSS

There are three implementations available: pseudo-elements, pseudo-classes, ...READ MORE

answered Jun 10 in CSS by Edureka
• 9,540 points
36 views
0 votes
1 answer

Rails - how to integrate a form with bootstraps css?

Here is how I did it  in my ...READ MORE

answered Jun 28 in CSS by Edureka
• 9,540 points
15 views
0 votes
1 answer
0 votes
1 answer

When to use IMG vs. CSS background-image?

You can transition a div's background image ...READ MORE

answered Jun 10 in CSS by Edureka
• 9,540 points
42 views
0 votes
1 answer
0 votes
0 answers

CSS: background image on background color

If this panel is chosen, a panel ...READ MORE

Jun 22 in CSS by Edureka
• 9,800 points
21 views
0 votes
0 answers

CSS background image that can scroll

I'm attempting to make a backdrop image ...READ MORE

Jul 5 in CSS by Edureka
• 9,800 points
6 views
0 votes
1 answer

Is there any way to colorize a white PNG image with CSS only?

Filters can be used with -webkit-filter and ...READ MORE

answered May 27 in CSS by Edureka
• 9,540 points
66 views
0 votes
1 answer

How to build a special polygon (a kite shape) with HTML & CSS only?

I made two divs, one for Arc ...READ MORE

answered May 28 in CSS by Edureka
• 9,540 points
68 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP