Question

This may be a very obvious question – apologies if it is.

I have the following:

.page
{
    width:100%;
    background-color: #fff;
    margin: 10px 10px 10px 10px;
    border: 1px solid #496077;
    padding: 4px 4px 4px 4px;
}

For some reason i ALWAYS receive the horizontal scroll bar on my browser which matches the padding and margin px’s (even when maximised). This leaves me without my margins and padding on the right.

if i remove the margins/border/padding there horizontal scroll bar is not present – but i really want them there for cosmetics

any help appreciated.

Answer 1

Try this

.page { background-color: #fff; margin: 10px 10px 10px 10px; border: 1px solid #496077; padding: 4px 4px 4px 4px; }

Removed width attribute