CSS : Full Screen Horizontal Bar

Step 1: HTML Code

<div id="menubar"> <div id="leftframe"></div> <div id="leftframe2"></div> <div id="leftframe3"></div> <div id="leftframe4"></div> <div id="leftframe5"></div> <div id="leftframe6"></div> <div id="leftframe7"></div> <div id="leftframe8"></div> </div>

Step 2: CSS Positioning

#menubar
{
width:100%;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 30px;
z-index: 1;
background-color: #FBAE5C;
}


#leftframe
{
position: absolute;
top: 0px;
left: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #FBAE5C;
color: #F7941D;
text-align: left;
vertical-align: middle;
}

#leftframe2
{
position: absolute;
top: 0px;
left: 12.5%;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #F7941D;
text-align: left;
vertical-align: middle;
}

#leftframe3
{
position: absolute;
top: 0px;
left: 25%;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #C2BE75;
color: #AAA003;
text-align: left;
vertical-align: middle;
}

#leftframe4
{
position: absolute;
top: 0px;
left: 37.5%;
margin: 0px;
padding: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #AAA003;
text-align: left;
vertical-align: middle;
}

#leftframe5
{
position: absolute;
top: 0px;
left: 50%;
margin: 0px;
padding: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #8ACCCA;
text-align: left;
vertical-align: middle;
}


#leftframe6
{
position: absolute;
top: 0px;
left: 62.5%;
margin: 0px;
padding: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #40B9E8;
text-align: left;
vertical-align: middle;
}

#leftframe7
{
position: absolute;
top: 0px;
left: 75%;
margin: 0px;
padding: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #F69AC1;
color: #E66BA4;
text-align: left;
vertical-align: middle;
}

#leftframe8
{
position: absolute;
top: 0px;
left: 87.5%;
margin: 0px;
padding: 0px;
width: 12.5%;
height: 100%;
z-index: 2;
background-color: #E66BA4;
color: #F69AC1;
text-align: left;
vertical-align: middle;
}

Taken From : http://www.highdots.com/forums/cascading-style-sheets/css-split-full-screen-horizontally-4379.html