Adding vertical and horizontal space for images using caption?

  • grady55

    (@grady55)


    14 years, 10 months ago

    Hello, I wonder how to put some space around images that have a caption. Adding an image without a caption, it works using hspace and vspace … as soon as the image has a caption, hspace/vspace have no effect and the surrounding text is too close. Thats my caption code:

    [caption id="" align="alignright" width="230" height="310" caption=' <a href="someurl" target="_blank" title="some title">some link text</a>'] <a href="somelink" target="_blank" title="sometitle"><img alt="" border="0" height="300px" hspace="15" vspace="19" src="image url" vspace="19" width="230px" /></a>[/caption]

    How else would I do that?

    Thanks 🙂
    `

Viewing 5 replies - 1 through 5 (of 5 total)
  • esmi

    (@esmi)

    14 years, 10 months ago

    hspace and vspace are outdated. Use CSS instead.

    Thread Starter grady55

    (@grady55)

    14 years, 10 months ago

    Thanks, but how would I do that in this special case?

    Regards

    esmi

    (@esmi)

    14 years, 10 months ago

    Using CSS.

    [caption id="" align="alignright" width="230" height="310" caption=' <a href="someurl" target="_blank" title="some title">some link text</a>'] <a href="somelink" target="_blank" title="sometitle"><img alt="" border="0" height="300px" style="padding:20px;" src="image url" width="230px" /></a>[/caption]

    Thread Starter grady55

    (@grady55)

    14 years, 10 months ago

    That did not change anything … I think the problem is the caption. Maybe I have to change the caption div which is creaded when using [caption]? In the resulting HTML its a div with the wp-caption class.

    <div class="wp-caption alignright"....>

    The CSS for that class looks like this:

    .wp-caption {
	/*max-width: 100% auto;*/
	max-width: 96%;		/* FF2, IE7, Opera9, Safari 3.0/3.1 will
							resize images in the main column if needed.
							97% so images with padding and border don't touch
							the right sidebar while being resized. Change this
							to 100% if you want, if your images
							don't have padding and a border */
	width: auto 100%;
	height: auto;  /* FF3 needs "auto", IE6 needs "100%", see next style*/
	display: block;
	border: 1px solid #dddddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px 0 0 0;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;	}

    Dont know. Ideas?

    Thanks.

    esmi

    (@esmi)

    14 years, 10 months ago

    It might help if we could see a page on your site that demonstrates the problem.

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

The topic ‘Adding vertical and horizontal space for images using caption?’ is closed to new replies.