Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › Float, Firefox issue HELP

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • July 25, 2011 at 5:52 am #33624
    mortimer14
    Member

    Hi I have been building a website that had too elements floating slightly on top of each other. They overlapped slightly, which looked great for the design, when viewed in safari. To my horror though when I viewed the web design in firefox most of my page was missing. So to fix this I had to add Overflow:hidden to my element in css, but this meant that the two elements float separately, one above the other and now not overlapping. :(

    Does anyone have advice on any fixes for this? As ideally I need them to overlap on most the browsers as this is what the client wanted from the design.

    Thank you

    Mortimer14

    July 25, 2011 at 6:53 am #83917
    wolfcry911
    Participant

    code? link?
    Its not often that FF and Safari render so different – did you validate?

    July 25, 2011 at 8:56 am #83920
    wolfcry911
    Participant

    you could simply use negative margins for overlapping floats, but we need to see how you approached this to recommend a fix.

    July 26, 2011 at 6:41 am #83885
    mortimer14
    Member

    Hi thank you so much for getting back to me, Ok I think I get what you mean, to help I have set up a link of the site for you to see exactly what I mean. You will see a circle graphic at the top below the green header bar which is orange. This is meant to overlap the grey bar slightly. However to stop my webpage looking funny in firefox for some reason i had to add overflow:hidden;.

    The url is here: http://www.papersky.co/webproof/surfacebi/index.html

    Hope some of this helps?

    July 26, 2011 at 8:32 am #83972
    mortimer14
    Member

    Hi I would like to say thank you so much I used absolute positioning as you suggested.. no idea why that never occurred to me :) and it appeared to solve the problem! you are both geniuses!

    Mortimer14

    July 26, 2011 at 8:58 am #83974
    wolfcry911
    Participant

    wow, that is a heavy page for the amount of content!

    What version of FF are you testing in? I removed the overflow:hidden from a number of elements to no effect.

    Go through and check all your html comments. If you view the source code, you’ll notice that a large portion of the page is shown as commented. The correct form is

    Dashes are reserved for the open and close comment delimiter – and there should only be two together. Using more can cause problems.

    July 26, 2011 at 10:03 am #83984
    mortimer14
    Member

    Brilliant thank you! I am currently browser testing, do you have any advice on making sure the page views versionable on multiple browsers. I have just nearly fainted looking the pages in different browsers :-s

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘CSS’ is closed to new topics and replies.