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 6 of 6
  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts

    image formatting question

    two things i would like to achieve:

    1) center the four images in the window so that there is equal space on both sides within white area

    2) have a small white space gap in between each photo

    Thanks.
    David

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    1) center the four images in the window so that there is equal space on both sides within white area
    Add a style of text-align:center; to its container element.
    2) have a small white space gap in between each photo
    Add sufficient padding-left and/or padding-right to the images.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Feb 2009
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i made the images smaller for testing purposes.
    i have text-align:center in my mycenter style. but the photos do not center up in the white box. did i put text-align:center in the wrong place?

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    did i put text-align:center in the wrong place?
    Who knows? Can we have a link to your page?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New Coder
    Join Date
    Feb 2009
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Again, that <font> has no purpose there, and should be avoided!

    Instead add a div to wrap your images like
    Code:
    <div id="main" class="center">
    
    <a href="sigalbhdc.html"><img width="120" alt="" src="Goldringthumb4.jpg" class="mycenter"/></a>
    
    <a href="beckerbhdc.html"><img width="120" alt="" src="Beckerthumb4.jpg" class="mycenter"/></a>  
     
    <a href="alvarezbhdc.html"><img width="120" alt="" src="Pamthumb4.jpg" class="mycenter"/></a>
    
    <a href="fahimbhdc.html"><img width="120" alt="" src="Sudithumb4.jpg" class="mycenter"/></a>
    </div>
    , and then add
    Code:
    div.center{
    text-align:center;
    }
    into your CSS
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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