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 3 of 3

Thread: Image Placement

  1. #1
    New Coder
    Join Date
    Feb 2009
    Location
    South Africa and USA
    Posts
    63
    Thanks
    30
    Thanked 0 Times in 0 Posts

    Image Placement

    When I align images left there is always a space between the left side of the image and the left border of the post.

    How do I remove this Margin/Space? I would like the image to be flush with the left side.

    I have checked my CSS and don't find any margin or padding on the coding for images.

    My site is here and I use WordPress.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello EnnisP,
    Could this 15px be the cause -
    Code:
    #contentleft p a img {
        border: 1px solid #CCCCCC;
        float: left;
        margin: 10px 15px;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    EnnisP (10-23-2011)

  • #3
    New Coder
    Join Date
    Feb 2009
    Location
    South Africa and USA
    Posts
    63
    Thanks
    30
    Thanked 0 Times in 0 Posts
    Thanks Excavator. Your answers are always spot on!

    One more question. What is the difference between the following scripts:

    Code:
    #contentleft p a img { 
      float: left; 
      margin:10px 15px 10px 0px;
      border:1px solid #ccc;
    }
    And

    Code:
    img.alignleft {
       padding: 0px; margin: 15px 10px 10px 0px; 
       display: inline;
    }
    And

    Code:
    img.centered {
      display: block;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 10px;
      padding: 0px;
    }
    It seems like each code set is repeating information.

    PS - You might have noticed I changed the code you sited.
    Last edited by EnnisP; 10-23-2011 at 10:25 AM. Reason: additional information


  •  

    Posting Permissions

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