CMS DataLife Engine - Система управления сайтами

Авторизация  
f1est0

Помогите поправить

Рекомендуемые сообщения

Изображение

Помогите поправить. Я думаю проблема в CSS. Чтобы не было пропуска такого.

Почему-то когда четное количество новостей образуется такая проблема (картинка сверху).

Когда 2-е новости было, все нормально, 3-и тоже нормально, добавил 4-ую стало так криво, попробовал добавить 5-ую стало снова все хорошо.

<div class="viewn_news" style="width:338px; float:left; margin:8px; min-height:350px;"> 
	<div class="screen"><a href="{full-link}" title="{title}"><dt>{title}</dt><span></span><img src="{image-1}"></a></div> 
		<div class="info"><span>{category}</span> {date}</div>
			<div class="title"><a href="{full-link}" title="{title}">{title}</a></div>
			<div class="line"></div> 
		<div class="text">{short-story limit="400"}...</div> 
	<a href="{full-link}" class="button">Читать далее</a>  <div class="reads">Просмотров: {views}</div>
</div>
.viewn_news {overflow:hidden;}
.viewn_news .screen {overflow:hidden; width:338px; height:156px; margin:0 0 10px 0;}
.viewn_news .screen img {width:338px; height:156px;}
.viewn_news .screen span {background:url("../images/viewn_news_screen.png") no-repeat 0 0; width:338px; height:156px; position:absolute;}
.viewn_news .screen span:hover {background:url("../images/viewn_news_screen_h.png") no-repeat 0 0; cursor:pointer;}
.viewn_news dt {overflow:hidden; background:url("../images/viewn_news_title.png") no-repeat 0 0; max-width:280px; height:30px; line-height:34px; padding:0 10px 0 15px; margin:10px 0 0 20px; position:absolute; color:#fff;}
.viewn_news .info {overflow:hidden; text-transform:uppercase; padding:0 0 3px 0;}
.viewn_news .info span {color:#dc9600;}
.viewn_news .title {text-transform:uppercase; font-size:18px;}
.viewn_news .title a:hover {color:#dc9600;}
.viewn_news .line {overflow:hidden; margin:5px 0 5px 0; height:1px; background:#dedede;}
.viewn_news .text {overflow:hidden; padding:0 0 10px 0;}
.viewn_news a.button {display:block; float:left; text-decoration:none; height:28px; line-height:32px; background:#2c3436; color:#fff; text-align:center; text-transform:uppercase; padding:0 10px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.viewn_news a.button:hover {background:#e69e00; text-shadow:1px 1px #9e6d00;}
.viewn_news .reads {float:left; margin:0 0 0 10px; height:27px; line-height:28px; padding:0 10px 0 12px; background:url("../images/viewn_news_reads.png") no-repeat 0 0;}
ul li.cf, ul li.cf a {color:#fff;}

 

Изменено пользователем f1est0

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Проблема в том, что блоки разной высоты.

Поставьте жестко высоту блока, а не min....

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Попробуте в "viewn_news" вместо "float:left;" добавить "display: inline-block; vertical-align: top;"

Изменено пользователем radrigo

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти
Авторизация