SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot martin's Avatar
    Join Date
    Jun 2001
    Location
    London
    Posts
    138
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Opera css guru required

    Hi All,

    I'm building a new website for our company. The design uses horizontal scrolling rather than vertical. I have built a couple of test pages and all seems to be working pretty much O.K. in all browsers except Opera 7 (PC).

    In this browser I have no horizontal scroll bars! I only assume it is due to the fact that I am 'floating' each column next to each other?

    The page can be viewed here:-

    http://www.powerhouseuk.com/test/

    My css here:-

    http://www.powerhouseuk.com/test/index/css/ph.css

    Funny enough, Opera 6 on the mac has the scroll bars and works O.K.

    Any help sorting this out greatly appreciated!
    Martin

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    A problem I see immediately is that you're using the same ID for your <div>s more than once per page ("column" and "boxlink" in particular). Change those to classes (and change your CSS accordingly) first.

  3. #3
    SitePoint Zealot martin's Avatar
    Join Date
    Jun 2001
    Location
    London
    Posts
    138
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Duh! sometimes I cannot see the wood for the trees!

    Corrected this obvious error, unfortunately, problem still remains...

    Any other suggestions?
    Martin

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,789
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi,

    The problem is caused by your use of position:fixed.

    e.g.
    Code:
    body>#wrapper>#logo { /* hide from Windoz */
     position: fixed;
    }
    Opera7 seems to hide the horizontal scrollbar when this command is issued. Opera 6.03 works perfectly well with it which is strange.

    I don't know why or what the solution is but an easy workaround would be to create your logo as a small image and then place it top left in the background of the body. Give it a background:fixed which IE interprets correctly when used in the background of the body tag and Opera 6 & 7 are ok with it as well.

    In this way you will have something that works in all three IE6, Opera6 & 7 (+ some other compliant browsers such as Mozilla):

    Code:
    body {
     background-attachment: fixed;
     background-image: url(logo.gif);
     background-position: left top;
     background-repeat: no-repeat;
    }
    Hope this helps.

    Paul

  5. #5
    SitePoint Zealot martin's Avatar
    Join Date
    Jun 2001
    Location
    London
    Posts
    138
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks very much Paul, just the kind of answer I was looking for, much appreciated!
    Martin


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
  •