Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Senior Member ravensjeff's Avatar
    Join Date
    Aug 2007
    Location
    Maryland
    Posts
    125
    Member #
    15751
    Ok I'm stumped. I haven't had one of these in a while, so I was due.

    Here is the situation. I'm trying to finish up a design for a client, and I am having an issue with a bottom margin appearing different in IE than in Firefox/Safari. That said, I'm not so sure it's IE's fault this time.

    On this page I have each testimonial in a div with a class of "block". I want that div to have a margin-bottom of about 35 to 40 pixels. But in order to get it to display a margin of 35 pixels, I have to set the margin-bottom to 70 px. (This is affecting Firefox/Safari only). In IE, I am getting much more margin than I want...something closer to the actual 70 pixels I specified.

    So, where is my conflict? Why am I only getting about half of the margin I have set in FF/Safari? Generally in these circumstances, I trust FF/Safari to be interpretting my code properly...but I don't see the cause here. The page validates...I'm stumped.

    Link to CSS

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    What happens if you use padding instead of margins?

    #content .block{width:630px; padding-bottom:70px;}


  4. #3
    Senior Member ravensjeff's Avatar
    Join Date
    Aug 2007
    Location
    Maryland
    Posts
    125
    Member #
    15751
    That was one of the first things I tried...the result is exactly the same.

  5. #4
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Your [minicode]cite[/minicode] elements are floated right. This means that they are actually flowed outside of your containing element with the block class. You need to expand your container to encompass the cite elements, as well. Try adding [minicode]overflow: auto[/minicode] to the [minicode]block[/minicode] CSS class, it should fix your problem in both browsers.

  6. #5
    Senior Member ravensjeff's Avatar
    Join Date
    Aug 2007
    Location
    Maryland
    Posts
    125
    Member #
    15751
    Brilliant! That makes sense...and I should have known that. We just had that conversation.

  7. #6
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Hah! So we did! I had totally forgotten


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:27 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com