Make the width of ul equal to the width of an image that is inside a li

Question

Make the width of ul equal to the width of an image that is inside a li

Navigation

#1 by (0 votes)

0

I have an ul, inside it has 3 li, inside one of these li has an image, I would like to know if it has a method via css to make the width of ul is equal to width of the image. (without changing the width of the image) I want to do this because the texts end up with a wider width than the image and I can not change the size of the image

<ul>
    <li><p>Texto texto texto</p></li>
    <li><img src="qualquer-img.png" alt="qualquer img"></li>
    <li><p>Texto texto texto texto texto texto texto texto texto texto texto</p></li>
</ul>

html5 css imagem

asked by anonymous 11.05.2017 / 18:24

1 answer

Condition (if) does not work to insert data Source rendering error Code128

score 0 · Answer 1

Place float: left on your ul, so ul size will fit your content.

HTML:

<ul>
    <li><p>Texto texto texto</p></li>
    <li><img src="https://image.freepik.com/free-vector/modern-abstract-background_1048-1003.jpg"alt="qualquer img"></li>
    <li><p>Texto texto texto texto texto texto texto texto texto texto texto</p></li>
</ul>

CSS:

ul {  
  float: left;
}

ul li {
  list-style-type: none;
}