Announcement

Collapse
No announcement yet.

Padding and/or margin differences using firefox

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Padding and/or margin differences using firefox

    Hi everyone

    Im hoping this is a simple one to fix. When using Firefox browser, some of the css styles for padding and possibly margin do not show, and the resulting layout is a poorer one than that of Explorer for example. See the following example

    http://www.harveymaps.co.uk/acatalog...MAS.html#SID=3

    The related products list at the bottom of the page looks fine in Internet Explorer, but in Firefox, the top and bottom padding is missing. there are other examples with different elements too, such as this page and section links

    http://www.harveymaps.co.uk/acatalog...land-maps.html

    Could someone help me understand why this is happening, and what i need to include to make this show correct in firefox please?

    Thanks in advance, Adam

    #2
    Hello Adam

    Sadly I can't help you, but I also have this issue at the top right and bottom right section that is pulled 'inwards' more than the main body

    I listed this as an issue/bug but never had an answer - I'm just wondering if this happens to be the way Firefox displays certain things? - no idea at all but you're not alone with this

    Comment


      #3
      There are many layouts where padding and margins are not the same. Quick fix CSS for section and related products margin in Firefox: .section-link-details {margin-bottom:2em;} #product-page-body .marketing-list-entry a img {margin:1em 0;}
      Peblaco

      Comment


        #4
        Hi Louise, once again, thank you for taking the time to read about my woes! I do wish I understood it all a bit more... I think I will flag it again to Sellerdeck, as it would seem others have also had difficulty with this one.

        I don't mind spending time trying to work out the CSS for things, but the mobile side of it is a bit complicated, so I appreciate your help very much.

        Adam

        Comment


          #5
          I have added the CSS styles to the stylesheet and it certainly does look better on firefox. Do you know what i might need to add to get the same section list to show a margin when the page is resized smaller such that the items display one beneath the other?

          The second page link above will show this problem.

          Thanks again

          Comment


            #6
            CSS styles need to be added to the bottom or can get overwritten, try: .section-link-details {margin-bottom: 2em !important;}
            Peblaco

            Comment


              #7
              OK, i will do that. Thanks for the help.

              Comment


                #8
                Louise, thanks again, your css fix has worked as intended for firefox. The !important tag seemed to force firefox to add the margin at the bottom for the sction-list-details.

                I tried also to use percent, to match the current margin css style for that div but that didn't work, so firefox must treat percentage widths differently? who knows!

                Appreciate all your help once again. Adam

                Comment

                Working...
                X