Проблема CSS, ширина 100% продолжает двигаться из позиции

Question

Я сейчас работаю над этим сайтом, http://no -illusions.nl Все идет хорошо, но я нашел довольно глупую вещь, которую не могу решить.

У меня есть div (обертка) шириной 500 пикселей, а внутри у меня есть разные div, содержащие изображения и текст. Теперь проблема в том, что текст имеет динамическую ширину, в некоторых частях он может быть шириной 200 пикселей, а на некоторых страницах - 350 пикселей.

Итак, я установил ширину на 100%, но теперь деталь просто плавает под тем местом, где я хочу!

Вот так это должно выглядеть, ! [как это должно выглядеть] [1]

Но вот как это выглядит,

Я надеюсь, что вы, ребята, можете дать мне толчок в правильном направлении.

Answer 1

Помните, что относительные размеры относятся к содержащемуся элементу.Если вы скажете width: 50%, вы получите элемент, равный половине ширины его контейнера.Таким образом, ваше высказывание width: 100% заставляет текст div принимать 100% ширины контейнера, и он также становится 500px.

Вы можете поместить изображение внутри текста div и разместить его.С соответствующими полями / отступами текст будет обернут вокруг изображения, и вы получите что-то вроде:

imgimgimg   text text text 
imgimgimg   text text text
imgimgimg   text text text

text text text text text
text text text text text

Базовая структура HTML будет выглядеть так:

<div style="width: 500px;">
    <div style="float: left; margin: 5px;"><img src="..."></div>
    text text text text text
</div>

в противном случае вы 'Мне нужно идти с фиксированным с помощью divs и динамически изменять ширину текста div в зависимости от того, есть изображение или нет.if (has image) { width: 350} else { width: 500} тип вещи.

Answer 2

Для тегов <p> вам вообще не нужна ширина, поскольку они являются блочными элементами, которые растягиваются до максимально возможной ширины.

Answer 3

Вы можете установить максимальную ширину 330 пикселей в вашем классе .update_respond.

Answer 4

.update_respond p{width: 273px;}

Answer 5

Это беспокоило меня раньше, и я обычно решаю это, устанавливая максимальную ширину абзаца. Это должно привести к переносу текста в пределах этой ширины.