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 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question How To Make Image Vertically/Horizontal Center In DIV?

    Hi,
    I want to make an image to be both vertically horizontally centered in a DIV area.

    Code:
    #myDiv div img{
    		border:none;
    		display:block;
    		margin: auto auto;
    }
    It's now horizontally centered, but it's all the way touching the top of the DIV, not vertically centered. I tried manually set "margin: 10px auto;", and it does move the image down a little bit but it's not what I want. I also tried to set all margin like margin-left, margin-top, etc, to auto. But still doesn't work.

    How to fix it?

    Many thanks.

  • #2
    New Coder
    Join Date
    Jun 2005
    Posts
    72
    Thanks
    0
    Thanked 0 Times in 0 Posts

  • #3
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I still cannot get it work after following the examples. Do I have to insert a <p> between div and image to get it work? I followed the examples and substitue the <p> with <img> but couldn't get it work.

    Quote Originally Posted by Dolphin123

  • #4
    Regular Coder
    Join Date
    Nov 2004
    Location
    The Netherlands
    Posts
    551
    Thanks
    0
    Thanked 0 Times in 0 Posts
    CATdude about IE6: "All your box-model are belong to us"

  • #5
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up

    I did something similar after being frustrated with CSS before your post. But I set margin to auto since hortizontal centering works with CSS. Then I did similar calculation to set only the marginTop. It is more simple.

    What a waste, all these code vs a simple 'auto' in CSS.



  •  

    Posting Permissions

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