Jump to content

CSS Menu ::: How To


fazlionline

Recommended Posts

Adding

ul {
   list-style: none;
}

ul li {
   float: left;
   }

Is one way to get things horizontal (and remove the bullets).

 

You have several errors in your code - your list should look like this:

></pre>
<ul>
Products

Laptops
Mobiles

Download


Mac Version
Windows Version

Contact Us

and 'size' is not a valid selector.

Link to comment
Share on other sites

In addition to Thelma's response, the invalid 'size' selector seems to be indicating that you are trying to set the width of the hyperlink. You would use 'width' instead. (i.e. width: 200px; )

 

Finally, after you fix the html (per Thelma's example), you will need to use a small script to for IE6 so that the dropdown will work.

Link to comment
Share on other sites

There are many examples on the web. The examples below are easy and not code-complicated.

 

Left Menu (vertical)

http://www.cafewebmaster.com/pure-css-mouseover-menu-without-javascript

 

Top Menu(horizontal)

http://www.cafewebmaster.com/dropdown-rollover-menu-pure-css-html

There's still a large number of IE6 users out there and so you will still need to use some script to make them work.

Link to comment
Share on other sites

i added Thelma's code

it looks like this now

http://www.geocities.com/fazlionline/css/css_list_menu2.html

No you haven't - at least not on the page this link goes to. You still don't have the list itself coded correctly - and you're missing the to CSS parts I gave you - one of which would also remove the bullets.
Link to comment
Share on other sites

You may want to look again at my earlier post (Post # 2 in this thread) where I clearly state that your HTML for your list is incorrect - you are missing the opening and closing

  • tags around the entire thing - and I posted the code that you should have. I also gave you some CSS to add to your CSS - specifically for ul and ul li - is there any reason you don't want to try that - or you have tried it and it didn't work?
Link to comment
Share on other sites

You need to be a bit more specific about what you really want - in the very first post in this thread, you say "How can I make it horizontal' - well, actually, you said 'how i can make it horizantal', but I think it means the same thing. ;)

 

Now you want to make it vertical.

 

Is it possible you may want your main list horizontal, but the sub items vertical under them?

Link to comment
Share on other sites

Dear Thelma

 

my menu looks like stairs, which i do not want.

first of all i want the submenu hidden by default, and should apear on mouse over.

 

when i solved this problem, then i will learn how to make it horizantal.

(i also want to learn the ocde for vertical, but later)

 

 

Thanks

Edited by fazlionline
Link to comment
Share on other sites

  • 2 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...