Jump to content


Hosting Developers Payment Shipping Accounting Templates Marketing Books

Our Partners


Latest News: (loading..)

- - - - -

Navigation Bar

Started by RowanMonterde, Dec 08 2011 06:44 AM
navigation bar header

This topic has been archived. This means that you cannot reply to this topic.
1 reply to this topic

#-19   RowanMonterde

RowanMonterde
  • Members
  • 4 posts

Posted 08 December 2011 - 06:44 AM

I'm trying to add a navigation bar on top of the page, but it just isn't working correctly.

So in header.php I have:


<div id="header" class="grid_24">

<div id="storeLogo"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'store_logo.png', STORE_NAME) . '</a>'; ?></div>

　

<script type="text/javascript">

$("#headerShortcuts").buttonset();

</script>

</div>

<table border="0" width="100%" cellspacing="0" cellpadding="2">

<tr>

<td>

<style media="all" type="text/css">@import "includes/menu_style.css";</style>

<div class="menu">

<ul>

<li><a id="current" href="" target="_self" >Home</a>

</li>

<li><a href="" target="_self">About</a>

</li>

<li><a href="" target="_self" >Products</a>

</li>

<li><a href="" target="_self" >Contact</a>

</li>

<li><a href="" target="_self" >Site</a>

<ul>

<li><a href="" target="_self">Shipping & Returns</a></li>

<li><a href="" target="_self">Privacy Notice</a></li>

<li><a href="" target="_self">Conditions of Use</a></li>

</ul>

</li>

</ul>

</div>

<div class="grid_24 ui-widget infoBoxContainer">

[size="2"]<[/size][size="2"][size="2"]div class[/size][/size][size="2"][size="2"]=[/size][/size][size="2"][size="2"]"ui-widget-header infoBoxHeading"[/size][/size][size="2"][size="2"]>[/size][/size][size="2"][size="2"]<?php[/size][/size] [size="2"][size="2"]echo[/size][/size] [size="2"][size="2"]'  '[/size][/size] [size="2"][size="2"]. [/size][/size][size="2"][size="2"]$breadcrumb[/size][/size][size="2"][size="2"]->[/size][/size][size="2"][size="2"]trail([/size][/size][size="2"][size="2"]' » '[/size][/size][size="2"][size="2"]);[/size][/size] [size="2"][size="2"]?>[/size][/size][size="2"][size="2"]</[/size][/size][size="2"][size="2"]div[/size][/size][size="2"][size="2"]>[/size][/size]

[size="2"][size="2"]</[/size][/size][size="2"][size="2"]div[/size][/size][size="2"][size="2"]>[/size][/size]

[size="2"][size="2"]</[/size][/size][size="2"][size="2"]td[/size][/size][size="2"][size="2"]>[/size][/size][size="2"][size="2"] [/size][/size]

[size="2"][size="2"]</[/size][/size][size="2"][size="2"]tr[/size][/size][size="2"][size="2"]>[/size][/size][size="2"][size="2"] [/size][/size]

[size="2"][size="2"]</[/size][/size][size="2"][size="2"]table[/size][/size][size="2"][size="2"]>[/size][/size]

..........and so on and so forth.

Now here is the entire /includes/menu_style.css

[size="2"][size="2"].menu[/size][/size][size="2"][size="2"]{[/size][/size]

[size="2"][size="2"]border[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]none[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]border[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]0[/size][/size][size="2"][size="2"]px[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]margin[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]0[/size][/size][size="2"][size="2"]px[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]padding[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]0[/size][/size][size="2"][size="2"]px[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]font-family[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]verdana[/size][/size][size="2"][size="2"],[/size][/size][size="2"][size="2"]geneva[/size][/size][size="2"][size="2"],[/size][/size][size="2"][size="2"]arial[/size][/size][size="2"][size="2"],[/size][/size][size="2"][size="2"]helvetica[/size][/size][size="2"][size="2"],[/size][/size][size="2"][size="2"]sans-serif[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]font-size[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]14[/size][/size][size="2"][size="2"]px[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]font-weight[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]bold[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]color[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]#8e8e8e[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]}[/size][/size]

[size="2"][size="2"].menu[/size][/size][size="2"][size="2"] [/size][/size][size="2"][size="2"]ul[/size][/size][size="2"][size="2"]{[/size][/size]

[size="2"][size="2"]background[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]url[/size][/size][size="2"][size="2"](images/menu-bg[/size][/size][size="2"][size="2"].gif[/size][/size][size="2"][size="2"]) [/size][/size][size="2"][size="2"]top[/size][/size][size="2"] [/size][size="2"][size="2"]left[/size][/size][size="2"][size="2"] [/size][/size][size="2"][size="2"]repeat-x[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]height[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]43[/size][/size][size="2"][size="2"]px[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]list-style[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]none[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]margin[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]0[/size][/size][size="2"][size="2"][color="#f8f8f8"];[/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]padding[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]float[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]left[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]padding[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]8[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]8[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]a[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]color[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#666666[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]font-weight[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]bold[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]line-height[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]43[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]padding[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]25[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]text-align[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]center[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]text-decoration[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]none[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]a[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:hover{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]color[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#000000[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]text-decoration[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]none[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]ul[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]background[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#e0e0e0[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]border-left[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]2[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]solid[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#0079b2[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]border-right[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]2[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]solid[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#0079b2[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]border-bottom[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]2[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]solid[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#0079b2[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]display[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]none[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]height[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]auto[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]filter:alpha([/color][/size][/color][/size][size="2"][color="#c5af75"][size="2"][color="#c5af75"]opacity[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]=[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]95[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]);[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]opacity[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0.95[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]position[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]absolute[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]width[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]225[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]z-index[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]200[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#5f5a60"][size="2"][color="#5f5a60"]/*top:1em;[/color][/size][/color][/size]

[size="2"][color="#5f5a60"][size="2"][color="#5f5a60"]/*left:0;*/[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][size="2"].menu[/size][/size][size="2"] [/size][size="2"][size="2"]li[/size][/size][size="2"][size="2"]:hover [/size][/size][size="2"][size="2"]ul[/size][/size][size="2"][size="2"]{[/size][/size]

[size="2"][size="2"]display[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]block[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]}[/size][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] {[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]float[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]none[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]padding[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]width[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]225[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]ul[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]a[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]font-size[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]12[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]font-style[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]normal[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]padding[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]10[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]0[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]15[/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]px[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]text-align[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#f9ee98"][size="2"][color="#f9ee98"]left[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]}[/color][/size][/color][/size]

[size="2"][color="#9b703f"][size="2"][color="#9b703f"].menu[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]li[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]ul[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"] [/color][/size][/color][/size][size="2"][color="#cda869"][size="2"][color="#cda869"]a[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:hover{[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]background[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#949494[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]color[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]#000000[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][color="#c5af75"][size="2"][color="#c5af75"]opacity[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"]:[/color][/size][/color][/size][size="2"][color="#ca7840"][size="2"][color="#ca7840"]1.0[/color][/size][/color][/size][size="2"][color="#f8f8f8"][size="2"][color="#f8f8f8"];[/color][/size][/color][/size]

[size="2"][size="2"]filter:alpha([/size][/size][size="2"][size="2"]opacity[/size][/size][size="2"][size="2"]=[/size][/size][size="2"][size="2"]100[/size][/size][size="2"][size="2"]);[/size][/size]

[size="2"][size="2"]}[/size][/size]

[size="2"][size="2"].menu[/size][/size][size="2"] [/size][size="2"][size="2"]p[/size][/size][size="2"][size="2"]{[/size][/size]

[size="2"][size="2"]clear[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]left[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]} [/size][/size]

[size="2"][size="2"].menu[/size][/size][size="2"] [/size][size="2"][size="2"]#current[/size][/size][size="2"][size="2"]{[/size][/size]

[size="2"][size="2"]background[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]url[/size][/size][size="2"][size="2"](images/current-bg[/size][/size][size="2"][size="2"].gif[/size][/size][size="2"][size="2"]) [/size][/size][size="2"][size="2"]top[/size][/size][size="2"] [/size][size="2"][size="2"]left[/size][/size][size="2"] [/size][size="2"][size="2"]repeat-x[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]color[/size][/size][size="2"][size="2"]:[/size][/size][size="2"][size="2"]#ffffff[/size][/size][size="2"][size="2"];[/size][/size]

[size="2"][size="2"]}[/size][/size]

With both of those things this is what my header looks like now:

<p class="menu">
  • Home
  • About
  • Products
  • Contact
  • Site
    • Shipping & Returns
    • Privacy Notice
    • Conditions of Use

So it looks as if the <ul><li> codes worked, but I want it to look like an actual navigation bar with a drop down for "Site."



Thanks in advance for help!
-Row

#-18   HPOS

HPOS
  • Members
  • 3 posts

Posted 08 February 2012 - 11:40 AM

#nav-menu ul


{


list-style: none;


padding: 0;


margin: 0;


}



#nav-menu li


{


float: left;


margin: 0 0.15em;


}



#nav-menu li a


{


background: url(background.gif) #fff bottom left repeat-x;


height: 2em;


line-height: 2em;


float: left;


width: 9em;


display: block;


border: 0.1em solid #dcdce9;


color: #0d2474;


text-decoration: none;


text-align: center;


}



/* Hide from IE5-Mac \*/


#nav-menu li a


{


float: none


}


/* End hide */



#nav-menu


{


width:30em


}



Thanks. Try this one if this your looking for.
Back to General Discussions


  1. osCommerce Support Forum
  2. → General
  3. → General Discussions
  4. Privacy Policy
  5. Forum Rules ·