Эта веб-страница, в которой я строим, имеет 10 классов div, уложенных в две строки (5 сверху, 5 внизу). У каждого есть изображение внутри. Chrome и Firefox полностью отображают все, за исключением одной небольшой текстовой фразы, которая отображается как гиперссылка, когда она не должна (см. Нижнюю часть этого сообщения для получения дополнительной информации). Это сигнализирует мне, что что-то в моем коде отключено, но я не могу для жизни понять, что. Все выглядит нормально, пока я не загружу FTP на сайт. Помощь очень ценится.Невозможно получить divs для рендеринга в IE9
HTML:
<div id="text-brands">
<h2 class="blueheader">Learn More About Our Featured Brands</h2>
<br />
<div class="featuredBrands">
<a href="http://www.attvtedetails.com" target="_blank"><img src="images/Brand Logos/ATT.jpg" width="150" height="150" alt="AT&T" /> </a> </div>
<div class="featuredBrands"><a href="http://www.brotherdetails.com" target="_blank"><img src="images/Brand Logos/BROTHER.jpg" width="150" height="150" alt="Brother" /> </div>
<div class="featuredBrands"><a href="http://www.dymodetails.com" target="_blank"><img src="images/Brand Logos/DYMO.jpg" width="150" height="150" alt="Dymo" /></div>
<div class="featuredBrands"><a href="http://www.fujifilmdetails.com" target="_blank"><img src="images/Brand Logos/FUJI.jpg" width="150" height="150" alt="Fuji Film" /> </div>
<div class="featuredBrands"><a href="http://www.hpdetails.com" target="_blank"><img src="images/Brand Logos/HP.jpg" width="150" height="150" alt="HP" /> </div>
<div class="featuredBrands"><a href="http://www.imation-memorexdetails.com" target="_blank"><img src="images/Brand Logos/IMATION.jpg" width="150" height="150" alt="Imation" /> </div>
<div class="featuredBrands"><a href="http://www.kensingtondetails.com" target="_blank"><img src="images/Brand Logos/KENSINGTON.jpg" width="150" height="150" alt="Kensington" /> </div>
<div class="featuredBrands"><a href="http://www.logitechdetails.com" target="_blank"><img src="images/Brand Logos/LOGITECH.jpg" width="150" height="150" alt="Logitech" /> </div>
<div class="featuredBrands"><a href="http://www.verbatimdetails.com" target="_blank"><img src="images/Brand Logos/VERBATIM.jpg" width="150" height="150" alt="Verbatim" /> </div>
<div class="featuredBrands"><a href="http://www.lexmarkdetails.com" target="_blank"><img src="images/Brand Logos/LEXMARK.jpg" width="150" height="150" alt="Lexmark" /> </div>
<br />
<br />
<br />
</div>
CSS:
#text-brands {
width: 925px;
float: left;
padding-top: 30px;
padding-right: 10px;
padding-bottom: 20px;
padding-left: 20px;
}
.featuredBrands {
margin: 0px;
padding: 10px;
float: left;
width: 150px;
border: 5px solid #EAEAEA;
clear: none;
height: 150px;
overflow: hidden;
}
Вот ссылка, что у меня проблемы с: http://www.officesolutions.com/technology-products.html
Последний вопрос (я на самом деле просто считаю, что это бонус, если кто-то может помочь). Крайняя левая категория в нижней части страницы «Категории продуктов» представляет собой гиперссылку (в частности, ссылку, на которую должен указывать логотип lexmark). Я не могу понять это, потому что никакой разметки вообще нет рядом с этой фразой. Это просто заголовок, но по какой-то причине он отображается как ссылка.
HTML:
<div id="content-bottom">
<div id="sitelinks">
<div class="column" style="border-left: none;">
<p><strong>Product Categories</strong></p>
<ul>
<li><a href="office-supplies.html">Office Supplies</a></li>
<li><a href="furniture-space-planning.html">Furniture & Space Planning</a></li>
<li><a href="facility-maintenance-supplies.html">Facility & Maintenance Supplies</a></li>
<li><a href="coffee-services.html">Coffee Services</a></li>
<li><a href="printing-promotional-products.html">Printing & Promotional Products</a></li>
<li><a href="technology.html">Technology</a></li>
</ul>
</div>
</div>
</div>
Вам не хватает закрывающих якорных меток в конце изображений для вашего первого блока кода. Добавьте их, и это может решить вашу проблему. Некоторые из других браузеров учитывают такие ошибки и автоматически отображают их соответствующим образом, тогда как IE не делает этого. Вы также можете запустить свой код через W3C Markup Validator, и он расскажет вам, где находится ваша ошибка. – Ian