(Solved) Width not adjusting to the whole page

(Solved) Width not adjusting to the whole page
0

#1

Hey there!

I am trying to have sections fit the whole page but there is still a margin despite me setting padding/margin to 0 both in the body and section parts. Can anyone help please? https://codepen.io/bensrd/pen/wrZrRo?editors=1100


#2

class .container-fluid, which wraps whole your page, has 15px padding on both sides.


#3

thanks @korzo, should I create a .container-fluid CSS with padding: 0px?


#4

set .container-fluid to padding:0 and h1 tag to margin-top:0
Hope it helps


#5

Thanks Junaid07 ! Now I still have the margin appearing despite the margin-top:0 setting :confused:


#6

add margin-top:0 to h1 tag

h1{
margin-top:0;
}


#7

It works wonders! Thank you so much :slight_smile:


#8

By default html sets margin top and bottom to all heading tags(Block level element). remove them and use padding instead.

Hope it helps


#9

So this means h1-h6 all include this behavior?


#10

yes even paragraph tags, Create a helper class for e,g

.no-padding{
padding:0;
}

and add this class whenever its needed.


#11

Great, thanks for the advice!