|
|
|||||||||
|
|||||||||
|
|||||||||
| |
|||
| ||||||||||||||||||||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Display Modes |
|
#1
|
|||
|
|||
|
CSS Position Problem!
Hi Guys - My first post here!
I'm having some trouble with positioning DIV's at the momment I was just wondering if anyone could help me - I've tried loads of diffrent things. Basically all I want is a list in a box, but whats happening is the box is above the list! So it looks like below ************************************************ * * ************************************************ - LI Content here - LI Content Here - LI Content Here Code:
#xxxxxx {border: 1px solid #999999; padding-left: 200px; padding-top: 15px; width: 500px;}
#xxxxxx ul {width: 20em; margin: 0; padding: 0; list-style: none;}
#xxxxxx li {float:left; position:inherit; width: 10em; margin: 0; padding: 0; list-style-image:url(/images/green_tick.gif); list-style-position:inside;}
Any ideas? |
|
#2
|
|||
|
|||
|
Removing the float:left; from li rules will do the job.
Be careful when playing with float rules. This is a better look for your code: Code:
.mydiv {border: 1px solid #999999; padding-left: 200px; padding-top: 15px; width: 500px;}
.mydiv ul {width: 20em; margin: 0; padding: 0; list-style: none;}
.mydiv li {position:inherit; width: 10em; margin: 0; padding: 0; list-style-image:url(/images/green_tick.gif); list-style-position:inside;}
<div class="mydiv">
<ul>
<li>li 1</li>
<li>li 2</li>
<li>li 2</li>
</ul>
</div>
But you could also format the ul instead div, and remove the div, whatever. |
![]() |
| Viewing: Dev Articles Community Forums > Web Design > Web Development > CSS Position Problem! |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|