html - Full width divisions using HTML5 and CSS3 (responsive) -


I'm relatively new to StackOverflow and I'm experiencing some difficulties in creating webpages

What is a one-page website that is divided into different sections, which is a full-width divas (i.e., 100% width of the screen) and is consistently with different background colors.

The problem is facing the Divis not take the full width of the screen and not only the white space on the sides, but also between 2 Divs - Also, when the window size decreases , Then the difference between divs increases.

The desired result is seen in the following websites:


The code that I Here's what I am using:

i) HTML:

  & lt; Html & gt; & Lt; Body & gt; & Lt; Div class = "full" id = "one" & gt; & Lt; H1 & gt; Some other & lt; / H1> & Lt; / Div & gt; & Lt; Div class = "full" id = "two" & gt; & Lt; H1 & gt; Some other & lt; / H1> & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;  

ii) CSS:

  .full {width = 100%; } # A {background color: #fff; } #two {background-color: # f13; }  

Please tell me where I am wrong /

html

  & lt; Div class = "full" id = "one" & gt; & Lt; H1 & gt; Some other & lt; / H1> & Lt; / Div & gt; & Lt; Div class = "full" id = "two" & gt; & Lt; H1 & gt; Some other & lt; / H1> & Lt; / Div & gt;  

css

  body, html {width: 100%; Height: 100%; Margin: 0; / * Default margin set 0 * / padding: 0; / * Default padding set 0 * /} .full {width: 100%; } # A {background color: gray; Height: 50%; / * Whatever you want to height / # # two [background color: # F13; Height: 50%; / * Whatever you want to height * /}. Fulll h1 {margin: 0; / * Default margin of H1 tag is 0 * / padding: 20px 10px 10px 20px; / * Padding if you want to place spaces between divines and div * /}  

Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -