طبقة لا تمتد إلى ارتفاع تحتوي على صورة

Question

http://www.martenminkema.nl

وطبقات من كل دخول كسب فقط ذروة النص التي يتضمنها. لا يؤخذ ارتفاع الصورة في الاعتبار، مما أدى إلى مشاكل مع بعض العلامات تخطيط في بعض الحالات.

وأتش تي أم أل:

<div id="entry-296" class="hentry entry gedachten">
<a href="http://www.martenminkema.nl/gedachten/2009/06/autobahnbar-1.html" rel="bookmark"><span class="date">12.06.09</span></a><h2 class="entry-title"><a href="http://www.martenminkema.nl/gedachten/2009/06/autobahnbar-1.html" title="Geplaatst onder Gedachten op 12 juni 2009 23:32 in de categorie(&euml;n): buitenland, met de volgende tags: berlijn">Autobahnbär</a></h2><div class="icoontje" title="Gedachten"><div class="linkwrapper transparent"><a href="http://www.martenminkema.nl/gedachten/2009/06/autobahnbar-1.html" class="clickable">&nbsp;</a></div></div>
<div class="entry-content">
<a href="http://www.martenminkema.nl/gedachten/Afbeeldingen/Autobahnb%C3%A4r-in-Berlijn.jpg" rel="lightbox" title="Beer aan de snelweg in Berlijn (foto: M. Minkema)"><img src="http://www.martenminkema.nl/gedachten/assets_c/2009/06/Autobahnbär-in-Berlijn-thumb-150xauto.jpg" width="150" height="112" alt="" class="icoon"/></a>
Beer met uitzicht, Tierpark Berlin op een vroege ochtend.</div>
</div>

والمغلق:

div.entry {
clear: both;
display: block;
font-size: 12px;
margin-bottom: 10px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
position: relative;
text-align: left;
width: 350px;
}

a[rel='lightbox'] {
color: black;
cursor: auto;
display: block;
font-size: 12px;
font-weight: bold;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 200px;
margin-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
text-decoration: none;
width: 150px;
}

والرابط الاليكتروني يحتوي على الصورة. ونظرا لارتفاع الصورة في أتش تي أم أل، ولكن وفقا لأدواتي تطوير ويب سفاري، رابط Lightbox لا يكتسب ارتفاع الصورة، مما أدى إلى أن طبقة div.entry يحصل الا في ذروة النص ويسن ارتفاع الصورة 'ر تؤخذ بعين الاعتبار.

وأي حل لذلك؟

وشكرا!

Answer 1

وتعطي تجاوز شعبة: مخفي و تأكد من DIV لديه عرض

Answer 2

وسؤالك غير واضح بعض الشيء ولكن جمع من تجربة لديك صورة داخل DIV الخاصة بك التي طرحت إلى اليسار.

ويمكنك استخدام تقنية شعبية تسمى clearfix للتأكد من DIV الخارجي هو نفس ارتفاع النص والصورة في داخله.

وعند النظر إلى الموقع الذي ذكر أن تتمكن من حل هذه كما يلي (لاحظ أنا واضاف "clearfix" الطبقة):

<div class="entry-content clearfix">
<a href="...">
<img class="icoon" width="150" height="147" alt="" src="..."/>
</a>
Sommige verkeersborden krijgen een totaal andere lading als je ze een stukje kantelt.
</div>

ويمكن العثور على كود CSS clearfix ومقال يوضح مشكلتك هنا:

http://www.positioniseverything.net/easyclearing.html