Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Senior Member -chris-'s Avatar
    Join Date
    Apr 2006
    Location
    SK
    Posts
    1,205
    Member #
    13102
    I have a problem with the navigation (in Firefox) on www.psalm91band.com. I can't figure out why it gets pushed over like it does. I have played around with settings for a while today to no avail. I was hoping a fresh set of eyes may be able to see the problem.

    HTML for the nav:
    HTML Code:
    <div id="listmenu">
     <ul class="style2">
      <li><a href="index.html">Home</a></li>
      <li><a href="music.html">Music</a></li>
      <li><a href="bios.html">Bios</a></li>
      <li><a href="concertsandevents.html">Concerts<br />/ Events</a></li>
      <li><a href="photos.html">Photos</a></li>
     </ul>
    </div>
    CSS for the site:
    Code:
    body { background-color: #000; margin: 30px; padding: 0; }
    .photo { background-color: #000; width: 600px; padding: 0px; }
    .text { background-color: #000; width: 570px; padding: 15px; }
    .topright { background-color: #000; width: 110px; padding: 15px; }
    .nav { background-color: #000; width: 110px; padding: 15px; vertical-align: top; }
    .horizontalstripe { height: 15px; background-color: #fff; }
    .verticalstripe { width: 15px; background-color: #fff; }
    h1 { font-size: 24pt; color: #c00; font-family: Verdana, Arial, Helvetica, sans-serif; }
    h2 { font-size: 16pt; color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; }
    p { font-size: 14pt; color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; }
    .style1 { font-size: 12pt; color: #c00; font-family: Verdana, Arial, Helvetica, sans-serif; }
    .style2 { font-size: 12pt; color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; }
    .style3 { font-size: 8pt; color: #f90; font-family: Verdana, Arial, Helvetica, sans-serif; }
    li { list-style-type: none; }
    div#listmenu { width: 100%; border-top: 2px solid #c00; background-color: #fff; }
    div#listmenu ul { margin: 0px; width: 100%; }
    div#listmenu li { background-color: #fff; border-right: 2px solid #c00; border-left: 2px solid #c00; border-bottom: 2px solid #c00; }
    div#listmenu li:first-child { border-left: 2px solid #c00; }
    div#listmenu li:hover { background-color: #fff; }
    div#listmenu a { padding: 0px; text-decoration: none; color: #f90; }
    div#listmenu a:hover { color: #c00; }
    a { color: #f90; }
    a:hover { color: #C00; }
    Portfolio | Blog | Twitter

    Was my post, or someone elses, helpful? Click the thumbs up to let everyone know!

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,720
    Member #
    5580
    Liked
    718 times
    I'm not sitting at my Firefox browser now, but I think this might be it ...

    You have:
    div#listmenu { width: 100%; border-top: 2px solid #c00; background-color: #fff; }

    Try this:
    div#listmenu { width: 100%; border-top: 2px solid #c00; background-color: #fff; float: left;}

    You might also try to give it a "real" pixel width, like .... width: 100px;

    Someone with their Firefox browser on will probably come up with the difinitive answer.


  4. #3
    Junior Member danburke's Avatar
    Join Date
    Jul 2006
    Posts
    29
    Member #
    13573
    just change your list menu ul to
    Code:
     div#listmenu ul { margin: 0; padding: 0; width: 100%; }
    I think lists have padding on them by default to make them indent, so adding padding: 0 prevents that. Also, when a value is zero you don't need to define the unit of measurement.

    Edit: Oops, someone beat me to it by a few seconds.

  5. #4
    Senior Member -chris-'s Avatar
    Join Date
    Apr 2006
    Location
    SK
    Posts
    1,205
    Member #
    13102
    Thanks Dan, the padding: 0 did it.
    Portfolio | Blog | Twitter

    Was my post, or someone elses, helpful? Click the thumbs up to let everyone know!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:15 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com