CSS align centre [Solved]

  • alex89
  • Bronze Member
  • Bronze Member
  • User avatar
  • Posts: 239
  • Loc: Western Australia

Post 3+ Months Ago

Hey guys

I'm trying to align a few elements centrally on the page, a fixed distance from the top.

I've got a <ul> element, with lists aligned around the outside in a circle. This works fine.

I've also added a few <div> elements, and they align fine in firefox, but go all screwy in IE and firefox safe.

This is the css for one of the divs:

Code: [ Select ]
    top: 340px;
    position: absolute;
    left: 50%;
    width: 200px;
    overflow: auto;
    margin-left: -100px;
  1.     top: 340px;
  2.     position: absolute;
  3.     left: 50%;
  4.     width: 200px;
  5.     overflow: auto;
  6.     margin-left: -100px;


I tried adding the below code to the <ul>, but it doesn't seem to be working.
Code: [ Select ]
text-align:center;


HTML:
Code: [ Select ]
<ul>
<li class="home">...</li> //a few more of these too
 
<div class="google">Search box</div>
 
<div id="settings"><a href="#settings"><b>Settings</b></a></div>
<div id="usertext">You are logged in as Administrator<br /></div>
 
</ul>
  1. <ul>
  2. <li class="home">...</li> //a few more of these too
  3.  
  4. <div class="google">Search box</div>
  5.  
  6. <div id="settings"><a href="#settings"><b>Settings</b></a></div>
  7. <div id="usertext">You are logged in as Administrator<br /></div>
  8.  
  9. </ul>


In action: http://uwadb.com/start/
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • alex89
  • Bronze Member
  • Bronze Member
  • User avatar
  • Posts: 239
  • Loc: Western Australia

Post 3+ Months Ago

The following worked:

Code: [ Select ]
 <ul>
<li class="home">...</li> //a few more of these too
</ul>

<div class="google">Search box</div>
<div id="settings"><a href="#settings"><b>Settings</b></a></div>
<div id="usertext">You are logged in as Administrator<br /></div>
  1.  <ul>
  2. <li class="home">...</li> //a few more of these too
  3. </ul>
  4. <div class="google">Search box</div>
  5. <div id="settings"><a href="#settings"><b>Settings</b></a></div>
  6. <div id="usertext">You are logged in as Administrator<br /></div>


(taking the <div>s out of the <ul>)

Thanks!

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 72 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.