Remove the blank space before wrapping the div

I want to remove the spaces that are. I am a layman. please forgive me if I make a stupid mistake. thank you in advance. see the image in which there is a place and also link to the code. image of design of page

html code:

<html> <head> <title>CSS</title> <link href="styles.css" rel="stylesheet"> </head> <body> <div id="wraper"> <div id="header"> Header </div> <div id="sidebar"> Side </div> <div id="content"> Content </div> <div id="footer"> Footer </div> </div> </body> </html> 

Css code:

  #wraper { margin:0 auto; width:800px; height:1000px; background:#FCFCFC; } #header{ background:#CFCFC0; height:100px; width:800px; } #content { float:right; width:600px; height:700px; background:#C0C0C4; } #sidebar { float:left; width:200px; height:700px; background:#CFFCCC; } #footer { clear:both; background:#C0CC0C; height:200px; width:800px; } 
+4
source share
5 answers

try to remove indentation and margins from body and html elements

 html, body { margin: 0; padding: 0; } 

As a good practice, you can load the normalize or reset stylesheet as the first css (e.g. http://meyerweb.com/eric/tools/css/reset/ ) to remove the difference style between browsers

+2
source
 *{ padding:0; margin:0; } 

give padding and margin manually for each tag later

+3
source

try this demo

add this only at the beginning of your css

 html, body { margin: 0 auto;padding:0; } 

0 for upper and lower margins and automatic for left and right margins to make it centered

0
source

Another option pointed out by @Fabrizio is to use CSS normalization.

https://github.com/necolas/normalize.css/blob/master/normalize.css

0
source

Source: https://habr.com/ru/post/1437137/


All Articles