Gap between image and the border

  • randerson5527

    (@randerson5527)


    14 years, 5 months ago

    I am having some trouble getting the border to appear correctly around an image. If I have an image that is aligned to the left, right or center and I put a border around that image, there is a gap to the left or the right of the image between the image itself and the border. So rather than being right next to the picture, the border is about 1/4 of an inch away from the picture. Here’s the craziest part. This 1/4 inch gab only occurs on one side of the picture. On the other sides of the picture, the border appears as it should – as an outline of the photo. For a visual representation of my problem, http://mncufoundation.org/news-information/financial_ed_data.

    Any help on how to solve this problem would be great appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Jon Dingman

    (@jdingman)

    14 years, 5 months ago

    in .alignright, you have this:

    padding: 0 0 0 15px;

    When in combination of the border:1px black

    that forces the border to be pushed out.

    You’ll want to replace the padding: 0 0 0 15px; with margin: 0 0 0 15px; so that it doesn’t include the border in the 15px

    Thread Starter randerson5527

    (@randerson5527)

    14 years, 5 months ago

    Jonathan,

    Thanks for your response. I am still learning HTML code. Below is the coding for the image on this page. Can you tell me where I should add the margin: 0 0 0 15px;?

    <img class=”alignright” style=”border: black 1px solid;” title=”Student Writing” src=”http://mncufoundation.org/wp-content/uploads/2011/12/student-writing-web.gif&#8221; alt=”” width=”275″ height=”150″ />

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Gap between image and the border’ is closed to new replies.