Why won't these classes work

OK. Ive got a problem with my inline styling. I am just messing around with a page, and practicing making a semantically correct page. For now, I am keeping any small amount of style necessary in the head. I will evetually export it to an external sheet. My problem is that som of my stylin is not taking effect in the browser, namley any tag that uses a class.

CSS (just the tags that have problems)

p.login_text
{
font-family:Arial, Helvetica, sans-serif;
font-size:8pt;
color:#000066;
}

ul.login
{
list-style:none;
float:left;
}
HTML (just where im having trouble)
<form action="login/login.php" method="post">
<p class="login_text">
<ul class="login">
<li>
Login
</li>
<li>
Username:
</li>
<li>
<input type="text" name="username" />
</li>
<li>
Password:
</li>
<li>
<input type="password" name="password" />
</li>
<li>
<input type="submit" name="submit" value="Login"/>
</li>
</ul>
</p>
</form>

Note: the UL:list-style:none; works, just not float:left. This is confusing, cause its choosing just some of the commands to use

full code @: http://www.robowhizards.com/examples

Dan

Whizard,

I changed "p.login_text" to "li.login_text" and added the class to the li tags.

<li class="login_text">
Username:
</li>

I noticed that just adding the p tag around the list items did take the styling.

Thanx. Case closed.

its kinda wierd, but I dont have time to wonder why.

Dan

Hey Dan,

It's because, unless you've declared the font style globally, uls have their own rules when it comes to text. So, if you declared font styles on a paragraph, and nested a ul in there, you'd have to redeclare the rules you wanted. You could actually just apply ALL of the styles above in the ul.login class and that'll be that.

On another, sidetrack kinda note... this form isn't really meant to be in an unordered list. You can just use the form elements-- input, label, fieldset, etc-- to apply structure.

Hope this helps,

Thanks! I always appreciate input into making my pages more semantically correct.

Dan