Is it possible to make a simple horizontal css menu without using lists?

This is a discussion on "Is it possible to make a simple horizontal css menu without using lists?" within the Web Page Design section. This forum, and the thread "Is it possible to make a simple horizontal css menu without using lists? are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices




Reply
 
LinkBack Thread Tools
  #1  
Old Sep 20th, 2007, 11:49
Reputable Member
Join Date: Jul 2007
Location: UK
Posts: 116
Thanks: 2
Thanked 1 Time in 1 Post
Is it possible to make a simple horizontal css menu without using lists?

My page layout is such that a list would destroy the non-css layout, and I don't want that if I can avoid it. At the moment I am struggling with creating nice a:hover boxes around my text links, having just a series of <a> links with no ordering as I want them to be horizontal in both CSS and normal HTML.

Difficult to explain in words, so here's a web page with the kind of links I'm after: http://dianealdred.com/category/bookbinding/
(The 'Home | About :: | Favourite Things' part)

My starting page is here: http://www.jonathanmortimer.co.uk/nature/

Any help or pointers to tutorials on this? I looked but everyone seems to be using lists.

Thanks!
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old Sep 20th, 2007, 12:17
Elite Veteran
Join Date: Sep 2006
Location: Pink House
Posts: 3,946
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

The example you gave uses lists:

Code: Select all
<ul>
		<li><a href="http://dianealdred.com">Home</a></li>
		<li class="page_item page-item-2"><a href="http://dianealdred.com/about/" title="About&nbsp;::">About&nbsp;::</a></li>
<li class="page_item page-item-225"><a href="http://dianealdred.com/favourites/" title="Favourite&nbsp;things">Favourite&nbsp;things</a></li>
	</ul>
I'm not sure why you wouldn't want to use lists since that is the correct way to create a navigation.

You just need to use a horizontal list...
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old Sep 20th, 2007, 12:32
Reputable Member
Join Date: Jul 2007
Location: UK
Posts: 116
Thanks: 2
Thanked 1 Time in 1 Post
Re: Is it possible to make a simple horizontal css menu without using lists?

Quote:
Originally Posted by Lchad View Post
The example you gave uses lists:
...
You just need to use a horizontal list...
How do I make a horizontal list in HTML? I've never come across one before.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old Sep 20th, 2007, 15:09
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,798
Thanks: 0
Thanked 17 Times in 17 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

Sorry the question makes no sense with me.

Simple horizontal list: http://css.maxdesign.com.au/listamatic/horizontal01.htm
__________________
Marc
Staff Manager - Webforumz.com


Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #5  
Old Sep 20th, 2007, 17:39
Reputable Member
Join Date: Jul 2007
Location: UK
Posts: 116
Thanks: 2
Thanked 1 Time in 1 Post
Re: Is it possible to make a simple horizontal css menu without using lists?

Quote:
Originally Posted by Marc View Post
Sorry the question makes no sense with me.
When viewed without the stylesheet I want the links to be all on one line, same layout as with the stylesheet. Every example I've seen using lists has each item on a separate line when viewed without the stylesheet.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #6  
Old Sep 20th, 2007, 17:41
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,798
Thanks: 0
Thanked 17 Times in 17 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

This cannot be done; unless you use tables.. I think.
__________________
Marc
Staff Manager - Webforumz.com


Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #7  
Old Sep 20th, 2007, 17:44
Reputable Member
Join Date: Jul 2007
Location: UK
Posts: 116
Thanks: 2
Thanked 1 Time in 1 Post
Re: Is it possible to make a simple horizontal css menu without using lists?

Quote:
Originally Posted by Marc View Post
This cannot be done; unless you use tables.. I think.
OK thanks, that's all I wanted to know.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #8  
Old Sep 20th, 2007, 17:48
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,798
Thanks: 0
Thanked 17 Times in 17 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

I may be wrong.
__________________
Marc
Staff Manager - Webforumz.com


Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #9  
Old Sep 20th, 2007, 19:44
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

Quote:
Originally Posted by jonnymorris View Post
When viewed without the stylesheet I want the links to be all on one line, same layout as with the stylesheet. Every example I've seen using lists has each item on a separate line when viewed without the stylesheet.
You are complicating your work unnecessarily.

Of those people who use a visual browser, almost all will get the CSS.

For the few that don't have CSS, you need not and should not attempt to reproduce your CSS layout. A list of links is logical and easy to read. Why mess with it?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #10  
Old Sep 21st, 2007, 13:59
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Is it possible to make a simple horizontal css menu without using lists?

I agree 1000000% what Mike said.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Help needed on horizontal css menu dreamabstract Web Page Design 1 Apr 24th, 2008 16:51
Horizontal Menu Using Lists Problem josephman1988 Web Page Design 5 Oct 26th, 2007 14:13
CSS Horizontal Menu Bar - IE Problems!! swillicott Web Page Design 47 Jul 23rd, 2007 21:42
CSS horizontal menu trademarkd Web Page Design 1 Jan 9th, 2007 07:10
horizontal drop-down menu da_stimulator JavaScript Forum 2 Nov 4th, 2004 11:16


All times are GMT. The time now is 19:20.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved