Help with CSS positioning

[Amazin]

hello everyone, I'm still in the process of learning about different ways to position with CSS. I'm having bit of trouble this one here:



As you can see in the screenshoot that there's a gap between the header and left hand side of the screen. I used absolute positioning but i can't seem to close the gap. what should I do?

here are the inputs:

H1 {border-style: solid;
text-align: center;
border-width: 5px;
color: #0066FF;
background-color: #b0c4de;
width: 100%;
position: absolute;
left: 10px ;
top: -1px ;}

can you see anything wrong?

 

[david64]

Remove the:

left: 10px ;

I don't see what you are using positioning for here though. Positioning is typically used to set elements to overflow each other.

 

[ServWise]

Yes as has been said, absolute positioning will lead to problems with layering of elements, you likely just want to use padding and margins to give you H1 the desired effects. (Or maybe you want it do layer over other elements?)

 

[Sober Media]

Amazin,

Add this to the header:

margin:0 auto;
text-align: center;