Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Nav bar wrapping on iPod view / Nav bar floating over page body in Opera

    Hi All. A couple of CSS issues for those of you more knowledgeable than me. At my wits' end for solving them.

    One: Wrapping Nav Bar on iPod

    Nav bar on this website displays fine for the most part, as intended in IE, Firefox, and Safari, but when viewed on an iPod, the nav bar "wraps" the last item underneath ("Shop"). How do I stop this?

    Two: Floating Nav Bar in Opera

    When viewing the page in all other browsers, its layout is correct, minus the wrapping issue mentioned above in iPod browsers. In Opera, however, the nav bar "floats" above the page body, separated by about 1/2 inch, rather than setting right on top of the page body as it should.

    Page in question: http://www.nickigreenwood.com/
    CSS file: http://www.nickigreenwood.com/css/style.css

    All pages and CSS have been verified with W3C, so I'm stumped. Any thoughts, suggestions, help, or miracles much welcomed. Thanks, all!

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,285
    Thanks
    23
    Thanked 611 Times in 610 Posts
    css file in #site_content remove the margin rules. You could also take out the padding and the borders:
    Code:
    #site_content {
      width: 950px;
      overflow: hidden;
      //margin: 44px auto 0 auto;
      //padding: 0px 0px 0px 0px;
      background: #FFF url(../images/site_content.png) repeat-y;
      //border-top: 0;
      //border-bottom: 0;
    }

  • #3
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks sunfighter - will give it a go!

    ...

    [edited]The floating nav bar issue has been resolved, looks great in all browsers. Still getting that wrapping "Shop" link on the nav bar in iPod and Kindle browsers. Any thoughts? I did remove all the code you suggested.
    Last edited by caleon; 10-31-2012 at 01:08 PM.


  •  

    Posting Permissions

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