SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problems with menu in Opera

    I have just had it pointed out to me that the site I am currently working on is broken in Opera.
    It works fine in Ff and it works to an acceptable level in IE.
    I was foolishly under the assumption that if it worked in Ff it would work in Opera.
    Can anyone help.
    The problem can be seen on http://www.family-camping-supplies.co.uk
    The problem is with the tab navigation.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  2. #2
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    http://stommepoes.nl/familycamping-opera.jpg

    Opera's free... can you download it? It's always handy to have another browser for testing : )

    It looks really bad, but I don't think it is. I think everything it simply thrown out of alignment because of the left section_nav section stacking top-bottom rather than side-to-side.
    Maybe you first need to set a width on that section_nav? And maybe have the wrapper clear that right float? Which shouldn't affect the left nav at all...

    Oh and note to Dan Schulz... if you see the screenshot, this is what I meant about Opera making tooltips of links. It must be a default-- I didn't set it that way.

  3. #3
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Download Opera for yourself. It's available for most platforms. Then download the Developer Console from Opera Developer Tools. It's similar to Firebug, although not as slick (and no JavaScript debugger), and it will be of great help in finding why things aren't displaying right.

    My guess, after a quick peek, is that the menu gets squashed like that because you haven't specified a width for the floated menu UL.
    Birnam wood is come to Dunsinane

  4. #4
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I do have Opera installed and have viewed the site, however I was querying how it could be fixed, it works perfectly fine in Ff, and I have served conditional comments to IE, but what about Opera?
    i'll download the devtool and see if I can sort it out.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you add width:680px to the rule for #section_nav Opera 9 displays the menu the same as Firefox 2.

    I wouldn't recommend setting pixel values for those menu links, though, since they contain text. If the user resizes the text, the menu will break. (This won't happen in Opera, which uses page zoom instead.) It would be better to set the widths in em.
    Birnam wood is come to Dunsinane

  6. #6
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cheers Tommy
    Unfortunately that menu is dynamically generated, so if the client adds or removes a section that menu will alter. Hence the reason I had not specified a width.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  7. #7
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Hmmm... maybe at least for Opera you can set min-width or something... that might be enough to do it, and it could grow...

    And you've set widths on the <a>, but since you're floating them, you could just give them side-padding and let them auto-width themselves... that way, if a customer adds a longer link name, all the text will appear. I wish I had known this back when I was doing my first menus...

    You could maybe also set a really wide width that would likely cover everything a customer could possibly stuff in there...

  8. #8
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nice one Stomme, the min-width fixed the problem.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  9. #9
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try setting width:100&#37; then. I can't test at the moment (on dial-up), but it should work. If your menu exceeds 100% of the page width you're in trouble anyway.
    Birnam wood is come to Dunsinane


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •