CODEWITHSUNDEEP
htmlcss
user87685
user87685

Reputation:

How to create block that is not resized to parent's width?

I have such a situation:

<div>
  <a href="#"><img alt="" src="img.jpg"></a>
</div>

div { width: 200px; }
a { display: block; width: auto; }

What I expect is the minimum required width for "a" element given - the width of an image in this case. But instead I got "a" with width of 200px. How to prevent this resizing?

Upvotes: 1

Views: 76

Answers (1)

David Pfeffer
David Pfeffer

Reputation: 39862

block elements occupy the width of their parent by definition, unless explicitly overridden by a specific width with defined units. You can't have it free float to the width of its contents. Consider inline.

Upvotes: 1

Related Questions