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 9 of 9
  1. #1
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts

    Centering image?

    REF: http://moderntimes.com/tmp/

    I have several images on this page and am wondering why I cannot center the images within the borders in FF, Safari, and Opera, however in IE7 the images seem to be centered?

    Any help?

    Thanks

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Add this to your CSS
    Code:
    .photo img {
    display:block;
    }
    http://developer.mozilla.org/en/docs...ysterious_Gaps
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    Hi Aerospace,

    Thanks for your reply. But the fix does not solve my problem. I do not use tables, and the specific image is not in a cell. As you probably noticed from my CSS, I simply put a border around the image. And the link you provided seems to apply to tables and their problems.

    I can fix it in FF, Safari, and Opera by making the bottom-padding 0px, but it does not display proper in IE7.

    I suppose I should take the hit in IE, and design for FF etc.?

    Thanks,
    Michael

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Quote Originally Posted by michael180 View Post
    Hi Aerospace,

    Thanks for your reply. But the fix does not solve my problem. I do not use tables, and the specific image is not in a cell. As you probably noticed from my CSS, I simply put a border around the image. And the link you provided seems to apply to tables and their problems.

    I can fix it in FF, Safari, and Opera by making the bottom-padding 0px, but it does not display proper in IE7.

    I suppose I should take the hit in IE, and design for FF etc.?

    Thanks,
    Michael
    Yes design for Firefox, tweak for IE. Maybe I'm missing something because you haven't explained yourself to well. The images seem fine to me. HOW are they supposed to look.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    Maybe it's my monitor, but I can see a larger gap at the bottom of the images even though the padding around the images is the same; 6px.?

  • #6
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Code:
    .photo_right img, .photo img {
    display:block;
    }
    Try that before you say it doesn't work. That article doesn't only apply to tables either. The title is misleading.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #7
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    As I said earlier, I tried it and it didn't work. I tried it again and it still doesn't work. I do not think there is a fix for this? I will just have to remove the border, or make it part of the image?

    Thanks anyway,
    Michael

  • #8
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Post a screen shot of what you are seeing. Circle the issue if possible. After using what I posted it works fine on your site. I used the web developer tool bar to test this. I would like you to implement my code into your CSS. You are likely doing it wrong.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #9
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    My apologies Aero, as usual you are right. I was coding it wrong. I did not realize that I must add a complete new class.

    It works fine now.

    Thanks so much,
    Michael


  •  

    Posting Permissions

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