Hi Experts,
I am just pulling my hair out over this problem. I want to have a box that expands all directions. For the life of me, I can't get the bottom bar to work properly. Here is my CSS.
#content {
height: 250px;
width: 65%;
float: left;
margin-top: 15px;
margin-left: 30px;
background-image: url(images/PageFiles/Conte
nt_TopBar.
jpg);
background-repeat: repeat-x;
}
#leftBar {
height: 100%;
width: 63px;
float: left;
background-image: url(images/PageFiles/Conte
nt_LeftSid
e_Bar.jpg)
;
background-repeat: repeat-y;
z-index: 4;
}
#rightBar {
height: 100%;
width: 63px;
float: right;
background-image: url(images/PageFiles/Conte
nt_RightSi
de_Bar.jpg
);
background-repeat: repeat-y;
background-position: 20px;
z-index: 2;
}
<body>
<div id="header"><br>
<img src="images/PageFiles/Titl
e_HP.gif" alt="Glasstoration Technologies" width="500" height="43" class="logo"></div>
<div id="sidebar">
<img src="images/PageFiles/Navb
ar_Top.jpg
" width="212" height="87"><br>
<img src="images/PageFiles/Navb
ar_Bottom.
jpg" width="212" height="66"></div>
<div id="content">
<div id="leftBar"><img src="images/PageFiles/Cont
ent_TopLef
t.jpg" width="63" height="81"></div>
<div id="rightBar"><img src="images/PageFiles/Cont
ent_TopRig
ht.jpg" width="63" height="81"></div>
</div>
Which generates this right here just perfectly.
http://www.thinkwelldesigns.com/graphics/Glassbox.jpgThe box expands lengthwise as I want it to. I just want to be able to next another dive in the Content Div, place it on TOP of the box sidebars and aligned at the bottom of the Content div.
And for the life of me, I can't do it.
Your help appreciated.
Start Free Trial