Correctly aligning image captions
问题 How can I achieve a layout like this? Right now I'm using this HTML: <div class="image"> <img> <div class="caption"> Caption Text </div> </div> And this CSS: .image { background-color: #2A2A2A; } img { max-width: 590px; } But the .image box is too big (since it expands to fit its parent): 回答1: The key is to not set a width for the img element, or the parent container. If the parent, .image is simply floated or in any other way adapted so that it shrinks to the size of its contents, this