Forum Moderators: not2easy

Message Too Old, No Replies

Left Aligning Div Tags

Left Aligning Div Tags

         

aitf311

3:53 pm on Dec 2, 2003 (gmt 0)

10+ Year Member



I am trying to get my last two divs to left align, they work in Mozilla, but in IE, they center themselves..

my styles


#container {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
background-color:#FFF;
}
#topFrame {
height: 77px;
margin: 0;
padding:0px;
text-align:left;
border-bottom-color: #FFF;
border-bottom-style: solid;
border-bottom-width: 2px;
}
#logoTime {
background: transparent url(images/logo.jpg) no-repeat top left;
position: relative;
left: 0px;
top: 0px;
height: 77px;
margin: 0;
padding:0px;
text-align:left;
}
#hearderBar1 {
position: relative;
left: 151px;
top: 0px;
background-color:#EBB223;
height: 20px;
width: 100%;
padding:0px;
text-align:left;
border-bottom-color: #FFF;
border-bottom-style: solid;
border-bottom-width: 1px;
}
#hearderBar2 {
position: relative;
left: 151px;
background-color:#668CBD;
height: 21px;
width: 100%;
padding:0px;
text-align:left;
border-bottom-color: #FFF;
border-bottom-style: solid;
border-bottom-width: 1px;
}
#hearderBar3 {
position: relative;
left: 151px;
background-color:#668CBD;
height: 34px;
width: 100%;
padding:0px;
text-align:left;
border-bottom-color: #FFF;
border-bottom-style: solid;
border-bottom-width: 2px;
}
#sideContainer {
width: 150px;
height: 100%;
}
#sideMenu {
background-color:#668CBD;
height: 150px;
width: inherit;
margin: 0;
padding:0px;
text-align:left;
border-right-color: #FFF;
border-right-style: solid;
border-right-width: 1px;
}
#yellowBar {
background-color:#EBB223;
height: 4px;
margin: 0;
width: inherit;
padding:0px;
text-align:left;
border-bottom-color: #FFF;
border-bottom-style: solid;
border-bottom-width: 2px;
border-top-color: #FFF;
border-top-style: solid;
border-top-width: 2px;
}

and here is the html


<div id="container">
<div id="topFrame">
<div id="logoTime">
<div id="hearderBar1"></div>
<div id="hearderBar2"></div>
<div id="hearderBar3"></div>
</div>
</div>
<div id="sideContainer">
<div id="sideMenu"></div>
<div id="yellowBar"><img src="images/blank.gif" height="0" width="0" /></div>
</div>
</div>

I know thats a lot, but I am very new to this and I am wanting to convert my schools page to all css..to save bandwith, and I am having a heck of a time doing it!

aitf311

10:46 pm on Dec 2, 2003 (gmt 0)

10+ Year Member



no one know?

your_store

10:51 pm on Dec 2, 2003 (gmt 0)

10+ Year Member



Are you saying the text within those two divs is centered or that the divs themselves are centered w/ respect to #sideContainer?

aitf311

5:33 pm on Dec 3, 2003 (gmt 0)

10+ Year Member



the divs themselves are centered in the page

AWildman

5:36 pm on Dec 3, 2003 (gmt 0)

10+ Year Member



Is that all of the css? Might you have a text-align center on a higher element, such as the body or an outermost div?