Welcome, Guest
Please Login or Register.    Lost Password?

CSS Horizontal Menu
(1 viewing) (1) Guest
Go to bottomPage: 1
TOPIC: CSS Horizontal Menu
#3580
CSS Horizontal Menu 2 Years, 4 Months ago Karma: 0
Good Day!

I've a small problem while building a CSS Horizontal Menu. Please do check the content as enclosed herewith and do suggest me the correct parameters either required for CSS or for HTML.

The instant position of Menu represents a Vertical Menu in centeralised position. I just need to adjust it in to Horizontal Formation.

I'd highly appreciate the solution as to instant problem.
File Attachment:
File Name: My_Site.zip
File Size: 379561
Maxman
Fresh Boarder
Posts: 5
graphgraph
User Offline Click here to see the profile of this user
Gender: Male maxbrandon@msn.com Location: South Asia Birthday: 12/19
The administrator has disabled public write access.
 
#3592
Re:CSS Horizontal Menu 2 Years, 4 Months ago Karma: 0
WOW! More than 40 views and no feedback. I think I've posted it in some wrong forum...
Maxman
Fresh Boarder
Posts: 5
graphgraph
User Offline Click here to see the profile of this user
Gender: Male maxbrandon@msn.com Location: South Asia Birthday: 12/19
The administrator has disabled public write access.
 
#3601
Re:CSS Horizontal Menu 2 Years, 4 Months ago Karma: 12
Design is looking cool.
I like the header image.

It's not really a traditional css menu. Using <ul><li> tags is considered better practice. They're a little easier to maintain. And easier to style when you get comfortable with css.

HTML tables and data cells contain a lot of default styling from the browsers. They're designed to display a table of data, similar to an excel spreed sheet. The list item (li) is design to be inside a <ul> (unordered list) or a <ol> (ordered list), and both of these are, by default expected to hold a list of items. Which is closer to a menu, for this reason, you're meant to get SEO benefits from menus encased in li tags.

But you're close with what you had. And if you're not fussed, you could try wrapping each link in a data cell. A great thing about table rows <tr> is that by default they're displayed horizontally.
So
<table><tr><td> LINK </td><td> LINK </td><td> LINK </td></tr></table>
Would create a horizontal menu.

If you replace your body tags with the following code you'll get something that works.

<body class="Web_BG">
<div class="Tbl_Top">
<table style="margin: 0px auto; position: relative; top: 150px;">
<tr>
<td >
<a href="#" class="WC_Btn"></a>
</td>
<td>
<a href="#" class="PF_Btn"></a>
</td>
<td>
<a href="#" class="SV_Btn"></a>
</td>
</tr>
</table>
</div>
</body>


There is some inline css you may want to rip out and place in an external css file.

Hope that helps.
Bambi
Moderator
Posts: 343
graphgraph
User Offline Click here to see the profile of this user
Gender: Male bambii7@msn.com Location: New Zealand Birthday: 12/21
The administrator has disabled public write access.
 
#3612
Re:CSS Horizontal Menu 2 Years, 3 Months ago Karma: 0
Thank you so much for your sound assistance Bambi. Now I'd be in a position to complete the interface easily. (:
Maxman
Fresh Boarder
Posts: 5
graphgraph
User Offline Click here to see the profile of this user
Gender: Male maxbrandon@msn.com Location: South Asia Birthday: 12/19
The administrator has disabled public write access.
 
#3613
Re:CSS Horizontal Menu 2 Years, 3 Months ago Karma: 0
Thank you so much for your sound assistance Bambi. Now I'll be in a position to complete the interface easily. (:
Maxman
Fresh Boarder
Posts: 5
graphgraph
User Offline Click here to see the profile of this user
Gender: Male maxbrandon@msn.com Location: South Asia Birthday: 12/19
The administrator has disabled public write access.
 
Go to topPage: 1
Moderators: Support
 
JOOMLA TEMPLATES Joomla Templates By JoomlaBear