• exzrael

    (@exzrael)


    Lets say I show an image in my post and decides to write text immediatle to the right of the image. The text will show without space between the image and the text, but I want the same space as shown below the image. Thats like 5px or something.

    Now, padding-right=”5″ wont work and im not to used to html so if anyone have a solution that would be lovely.

    Thank you for your time.

Viewing 4 replies - 1 through 4 (of 4 total)
  • petit

    (@petit)

    You should really do this in your stylesheet, normally called style.css.
    When you insert an image in your post, you use the (X)HTML editor and you add a class to your image tag:
    <img src="someimage.jpg" class="left" ….>

    In your stylesheet you add a style rule to left align the image and give it some space to the right and bottom:
    .left{
    float:left;
    margin:0 10px 5px 0;
    }

    This rule will give a 10 pixel margin to the right of the image and 5 pixels below.
    Change to your satisfaction. For a right aligned image you can use a class "right":
    <img src=”someimage.jpg” class=”right” ....>
    and a style rule:
    .right{
    float:right;
    margin:0 0 5px 10px;
    }

    This lets you have text to the left of the image with some space to the left and below the image.

    Thread Starter exzrael

    (@exzrael)

    Lovely. I thank you greatly for this.

    GoutWeed

    (@goutweed)

    If you use pictures alot and cant be bothered to insert a class=”” tag for every picture, an alternative solution can be to make a border in the colour as the background.
    .posts img {border: 3px solid #ddd; padding:2px; background-color: #fff;}
    In this example the border is 4 pix wide. This solution makes a border on all sides of the picture. If you perfer more space, this might look foolish.

    GoutWeed

    (@goutweed)

    I have no idea why it should be 4 px wide, when it clearly is 3. Sorry

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Padding/margin images in post’ is closed to new replies.