html - Floating divs not floating left -


okay, supposed in 1 139px height header , renders such in dreamweaver, view in browser menu div splits down onto second row.

here's html:

<div id="header">     <div id="header2">         <div id="title">             <a href="index.html"><img src="titleimg.png" border="0" /></a>         </div>         <div id="menu">         <div id="one"></div>             <div id="two"></div>             <div id="three"></div>             <div id="four"></div>             <div id="five"></div>         </div>    </div> </div> 

and here css:

#header {     top: 0;     left: 0;     position: fixed;     height: 139px;     width: 100%;     background-image: url('headerbg.png');     border-bottom: solid 1px #797978;     text-align: center;     display: inline-table; } #header2 {     width: 1040px;     margin: 0 auto;     text-align: left; } #title {     padding-top: 27px;     width: 287px;     height: 112px;     background-image: url('title3d.png');     background-repeat: no-repeat;     background-position: right bottom;     float: left; } #menu {     width: 753px;     height: 13px;     border-left: solid 1px #474747;     display: inline-table; } #one {     width: 19%;     height: 139px;     border-right: solid 1px #474747;     float: left; } #two {     width: 19%;     height: 139px;     border-right: solid 1px #474747;     float: left; } #three {     width: 19%;     height: 139px;     border-right: solid 1px #474747;     float: left; } #four {     width: 19%;     height: 139px;     border-right: solid 1px #474747;     float: left; } #five {     width: 19%;     height: 139px;     border-right: solid 1px #474747;     float: left; } 

help appreciated!

you making mistake of thinking total width 1040px adding width of #menu , #title forgetting have 1px border-left on #menu hence width becomes 1041 , hence gets pushed over. if reduce either menu or title's width 1pixel go :)

also can save code on css menu elements if going repeat same code #one, #two etc etc:

#menu > div {     width:19%;     height:139px;     border-right: solid 1px #474747;     float:left; } 

Comments

Popular posts from this blog

PySide and Qt Properties: Connecting signals from Python to QML -

c# - DevExpress.Wpf.Grid.InfiniteGridSizeException was unhandled -

scala - 'wrong top statement declaration' when using slick in IntelliJ -