проблема с бордюром - HTML и CSS

Magneto · 23.11.2009, 05:31

html :

Код:

<!doctype html>
<html>
<head>
<title>Название страницы</title>
<meta http-equiv="content-type" content="tex/html; charset=utf-8">
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="topads"> 
	<div class="topads_ad"><a href="#"><img src="top_ad1.gif" alt="Баннер" /></a></div> 
	<div class="topads_ad"><a href="#"><img src="top_ad2.gif" alt="Баннер" /></a></div> 
	<div class="topads_ad"><a href="#"><img src="top_ad3.gif" alt="Баннер" /></a></div> 
	<div class="topads_ad"><a href="#"><img src="top_ad4.gif" alt="Баннер" /></a></div>  
</div>
</body>
</html>

css :

Код:

@charset "utf-8";

* {
	padding:0;
	margin:0;}

#topads {
	width:980px;
	height:200px;
	margin-top:150px;
	margin-left:auto;
	margin-right:auto;
	background-color:#999999;}

.topads_ad {
	float:left;
	margin-right:8px;
	border:1px solid #ffff55;}

ссылка на страницу - http://magneto.wml.su/ht/index.htm

Как видно, нижний бордюр не обтекает изображения - такое впечатление что задан параметр padding(4-5px) для нижнего бордюра - как исправить это ?
Где я ошибся ?
Нужно чтоб рамка обтекала изображение без каких либо отступов .

cooperOk · 23.11.2009, 10:03

попробуй добавить для img стиль vertical-align: bottom; или поставь margin: 0px;

Magneto · 23.11.2009, 21:14

решил проблему следующим образом
css :

Код:

@charset "utf-8";

* {
	padding:0;
	margin:0;}

#topads {
	width:980px;
	height:200px;
	margin-top:150px;
	margin-left:auto;
	margin-right:auto;
	background-color:#999999;}

.topads_ad {
	float:left;
	margin-right:8px;
}
	
.topads_ad img {
	border:1px solid #ffff55;
	vertical-align:bottom;}

ссылка на страницу - http://magneto.wml.su/ht/index2.htm

cooperOk - спасибо за vertical-align:bottom;

23.11.2009, 10:03	#2
cooperOk Пользователь Регистрация: 11.11.2009 Сообщений: 66	попробуй добавить для img стиль vertical-align: bottom; или поставь margin: 0px; Последний раз редактировалось cooperOk; 23.11.2009 в 10:23.

23.11.2009, 21:14	#3
Magneto Форумчанин Регистрация: 10.02.2008 Сообщений: 178	решил проблему следующим образом css : Код: `@charset "utf-8"; * { padding:0; margin:0;} #topads { width:980px; height:200px; margin-top:150px; margin-left:auto; margin-right:auto; background-color:#999999;} .topads_ad { float:left; margin-right:8px; } .topads_ad img { border:1px solid #ffff55; vertical-align:bottom;}` ссылка на страницу - http://magneto.wml.su/ht/index2.htm cooperOk - спасибо за vertical-align:bottom;

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Проблема с рамами/Проблема с ЖД	DRAGGER	Компьютерное железо	6	04.01.2009 23:37