HTML width messed up by border

Question

HTML/CSS novice here.

Trying to put into practice what I\'ve learned on Codeacademy and I\'m stuck with an issue where my header which is set to width:100% ends up going

Answer 1

Adding a border increases the element's width past 100%.

You can play with the box model, as others have suggested, using box-sizing.

However, in this case, I suggest removing width:100%.
The

will span the entire width of the page by default.

You can also safely remove margin:auto.

div#header {
    height: 100px;
    background-color: white;
    border: 10px solid black;
    font-size: 80px;
    text-align: center;
    font-family: Helvetica, Ariel, Sans;
}

http://jsfiddle.net/93EPg/

0 讨论(0)

查看其它2个回答

发布评论:

提交评论

---

•  加载中...