Jump to content

Horizontal Menu


fishcuisine

Recommended Posts

Hello,

 

I am trying to improve the look of my MENU (Horizontal Navigation Bar

 

Re: www.tokyo-sushi-chef-institute.com

 

I found an interesting MENU in the following website and wanted to create a variation of it

 

Link: http://www.cordonbleu.edu/

 

I am thinking it is an html/css created Menu. Probably using a one row TABLE with several blocks would be the way to go, placing the link words in each block.

Any expert opinions I wonder…?

 

Regards

rk

Link to comment
Share on other sites

The menu with the blue background in the link does use a table, but most expertss would recommend using a list with the li tags using float: left;

 

Have a look at some examples of pure CSS menus which don't need javascript here:-

http://www.cssplay.co.uk/menus/

like these ones

http://www.cssplay.co.uk/menus/tab_highlight.html

http://www.cssplay.co.uk/menus/pro_horizontal.html

where you can download the html and CSS styles and edit as you want.

Link to comment
Share on other sites

The menu with the blue background in the link does use a table, but most expertss would recommend using a list with the li tags using float: left;

 

Have a look at some examples of pure CSS menus which don't need javascript here:-

http://www.cssplay.co.uk/menus/

like these ones

http://www.cssplay.co.uk/menus/tab_highlight.html

http://www.cssplay.co.uk/menus/pro_horizontal.html

where you can download the html and CSS styles and edit as you want.

Link to comment
Share on other sites

Hello Wickham,

 

You have an interesting offer.

As you know I am in the process of creating my website using Dreamweaver MX:

www.tokyo-sushi-chef-institute.com

 

Currently all the pages are in 1 column format. But I need to add more content on each page thus my need to create 3 columns per page. Do you have a quick and easy method of creating a 3 column page?

 

I am trying to do it within Dreamweaver MX but these folks do not provide a proper tutorial for their own product.

 

Regards

rk

Link to comment
Share on other sites

This edit of your page has three columns:-

http://www.wickham43.com/forumposts/seafoodtokyo-sushi-chef-institute101117.html

 

I added backgrounds to the columns to see the extent of them but you can delete them.

 

The wrap div is 1050px wide to suit the header image. Remember if you edit the widths that the total width is all the div widths plus side margins plus side padding plus side borders (if any) so at present it is

#left 150px + 2*5 padding = 160px

#right 150px + 2*5 padding = 160px

#middle 720px + 2*5 padding = 730px

Total 1050px like #wrap and the header image.

 

I deleted all the blockquotes, there were so many of them, and put a margin top and bottom onto the p tag to create the space between the p tags.

 

I didn't change the menu.

 

I hope that helps.

Link to comment
Share on other sites

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...