Как при float: left фото оставить внутри details
Без float:left
details {
cursor: pointer;
border: 1px solid #aaa;
border-radius: 4px;
padding: 0.5em 0.5em 0;
margin-top:5px;
min-width: 400px;
}
summary {
margin: -0.5em -0.5em 0;
padding: 0.5em;
}
details[open] {
padding: 0.5em;
}
details[open] summary {
border-bottom: 1px solid #aaa;
margin-bottom: 0.5em;
}<details open="">
<summary>
<span style="font-size:14px;">
<span style="font-family:Georgia,serif;">Доп. Информация
</span>
</span>
</summary>
<div><img alt="" src="https://img.gazeta.ru/files3/34/14989034/59051691-10915089-image-m-34_165-pic_32ratio_900x600-900x600-67347.jpg" style="width: 350px; height: 200px;" /></div>
asdasdasd
</details>float:left
details {
cursor: pointer;
border: 1px solid #aaa;
border-radius: 4px;
padding: 0.5em 0.5em 0;
margin-top:5px;
min-width: 400px;
}
summary {
margin: -0.5em -0.5em 0;
padding: 0.5em;
}
details[open] {
padding: 0.5em;
}
details[open] summary {
border-bottom: 1px solid #aaa;
margin-bottom: 0.5em;
} <details open="">
<summary>
<span style="font-size:14px;">
<span style="font-family:Georgia,serif;">Доп. Информация
</span>
</span>
</summary>
<div style="float:left"><img alt="" src="https://img.gazeta.ru/files3/34/14989034/59051691-10915089-image-m-34_165-pic_32ratio_900x600-900x600-67347.jpg" style="width: 350px; height: 200px;" /></div>
asdasdasd
</details>Ответы (1 шт):
Автор решения: Евгений Ли
→ Ссылка
К "details" добавляете - "overflow: auto;" и псевдокласс ":after" с стилями в коде также описанных.
details {
cursor: pointer;
border: 1px solid #aaa;
border-radius: 4px;
padding: 0.5em 0.5em 0;
margin-top:5px;
min-width: 400px;
overflow: auto;
}
details::after {
content: "";
clear: both;
display: table;
}
summary {
margin: -0.5em -0.5em 0;
padding: 0.5em;
}
details[open] {
padding: 0.5em;
}
details[open] summary {
border-bottom: 1px solid #aaa;
margin-bottom: 0.5em;
}<details open="">
<summary>
<span style="font-size:14px;">
<span style="font-family:Georgia,serif;">Доп. Информация
</span>
</span>
</summary>
<div style="float:left"><img alt="" src="https://img.gazeta.ru/files3/34/14989034/59051691-10915089-image-m-34_165-pic_32ratio_900x600-900x600-67347.jpg" style="width: 350px; height: 200px;" /></div>
asdasdasd
</details>