0

Tenho uma ul, dentro dela tem 3 li, dentro de uma dessas li tem uma imagem, eu gostaria de saber se tem um método via css para fazer com que a width da ul fique igual a width da imagem. (sem alterar a width da imagem) Eu quero fazer isso pois os textos acabam ficando com a width maior do que a da imagem e não posso alterar o tamanho da imagem

<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>
4
  • 1
    Eu acredito que esse deveria ser o comportamento padrão da ul. Você pode incluir o CSS que você utiliza? Commented 11/05/2017 às 16:29
  • o problema é que os textos acabam ficando maiores que a imagem, e ainda não adicionei css nesta parte do código. Commented 11/05/2017 às 16:47
  • Talvez usar width e height definido?
    – Paz
    Commented 11/05/2017 às 16:49
  • Como disse na pergunta não posso alterar o tamanho da imagem e irei ter varias listas assim e gostaria de uma solução para todas Commented 12/05/2017 às 12:07

1 Resposta 1

0

Coloque float: left na sua ul, assim o tamanho da ul se adequará a seu conteúdo.

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;
}
2

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .