Forum Moderators: not2easy

Message Too Old, No Replies

centering a div with nested div's on a page

can't get this working so that I have a page that always centers

         

tobypowers

4:17 pm on Apr 18, 2006 (gmt 0)

10+ Year Member



I tried this earlier but still can't get it work - seems like an easy task but still too hard for me ;-)

designed a page with a container div that contains several pieces and nested divs - if you go on the page <snip> and have a look please. the css i add here:

body {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
font-style: normal;
font-weight: normal;
color: #333333;
background-color: #eeeeee;
}

div#container {
height: 540px;
width: 825px;
background-color: #eeeeee;
margin:0 auto;
}

div#Site {
position: absolute;
top: 125;
left:180px;
float: left;
height: 415px;
width: 420px;
overflow: auto;
}

img#Header {
position: absolute;
top: 0px;
left: 0px;
}

img#Navi {
position: absolute;
top: 75px;
left: 0px;
}

img#hdl {
position: absolute;
top: 75px;
left: 180px;
}

img#Kontakt {
position: absolute;
top: 438px;
left: 0px;
}

img#Pic1 {
position: absolute;
top: 0px;
left: 625px;
}

img#Pic2 {
position: absolute;
top: 135px;
left: 625px;
}

img#Pic3 {
position: absolute;
top: 270px;
left: 625px;
}

img#Pic4 {
position: absolute;
top: 405px;
left: 625px;
}

[edited by: SuzyUK at 6:22 pm (utc) on April 19, 2006]
[edit reason] no urls thanks, see TOS linked at bottom of page [/edit]

4hero

4:35 pm on Apr 18, 2006 (gmt 0)

10+ Year Member



Hi if you try this:

body {
font-family: Geneva, Arial, Helvetica, sans-serif;
text-align:center;
font-size: 10px;
font-style: normal;
font-weight: normal;
color: #333333;
background-color: #eeeeee;
}

div#container {
height: 540px;
width: 825px;
background-color: #eeeeee;
margin:0 auto;
text-align:left;
position:relative;
}

That should work ;)

tobypowers

5:07 pm on Apr 18, 2006 (gmt 0)

10+ Year Member



hero!

thank you so much - it was quite easy and I'm greatful for such immediate help. Problem solved - tobypowers happy again!

;-)

4hero

5:29 pm on Apr 18, 2006 (gmt 0)

10+ Year Member



happy to help :)

I should have explained what I did to your code..

in your body, IE requires text-align:center for the div to be centered, and position relative in your container allows for div's inside to be positioned absolutely.

tobypowers

3:55 pm on Apr 19, 2006 (gmt 0)

10+ Year Member



it was a great help - thanx again :-)