I have a paragraph of text, sitting in a p-tag. Inside this text, there is an image. For that image, I want to add a title below using the small tag. This is the HTML code (I added line breaks for better readability):
<p>Lorem ipsum dolor sit amet, <img src="img/myimage.png" alt="myimage" /><small>
Hey look, thats my image!</small><br />consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam</p>
Now I want to add a bottom margin to the small-tag using this CSS-code:
p small {
margin-bottom: 30px;
}
It is not working, no margin-bottom is applied. The selector is right as I can change the left margin, text color and so on.
How do I add a margin-bottom to small in Twitter Bootstrap?
p smallis aninlineitem, and you can’t add margins to inline items. Try:The only drawback about
inline-blockis that you might run into cross-browser compatibility issues.In your specific example, perhaps you can wrap the
imgandsmallin a div, then define: