Форум PHP программистов > Выронить по горизонтален

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Выронить по горизонтален

fortuna

11.03.2013 - 13:19

Не могу выронить , получается ерундистика .
Хочу сделать вот так .
user posted image

А получается вот так ..
user posted image

Как выронить ?

.properties-block {
    float:left;
    width:43.3%
}

.properties-block dl {
    padding: 0 0 8px 0;
    background: url([url]http://www.site.ru/tpl/images/tr_pix.gif[/url]) repeat-x 0 11px;
}

.properties-block dt {
    color: #666;
    margin-right: 33%;
}

.properties-block dd {
    width: 30%;
    font-size: 13px;
}

.ui-helper-clearfix {
display: block;
}

.fr{
    background: #fff;
}


<div class="ui-helper-clearfix">
<div class="properties-block">
   <dl class="ui-helper-clearfix clearfix">
     <dd class="fr">4 дюйм</dd>
     <dt class="property_11248"><span>Диагональ экрана</span></dt>
   </dl>
     <dl class="ui-helper-clearfix clearfix">
     <dd class="fr">смартфон</dd>
     <dt class="property_254"><span>Тип</span></dt>
   </dl>       
</div>
</div>

SerginhoLD

11.03.2013 - 16:05

<!doctype html>
<html>
<head>
<style>
/* вместо  background: #eee;  вставляем фон точек */ 

.block { background: #eee; border: 1px solid #ddd; overflow: hidden;}
.left { float: left; background: white;}
.right { float: right; background: white; width: 200px;}
</style>

</head>
<body>
  
  <div class="block">
    <div class="left">text</div>
    <div class="right">test 2</div>
  </div>
  <div class="block">
    <div class="left">text text text</div>
    <div class="right">test 6 test</div>
  </div>

</body>
</html>

_____________
"internet explorer всех правильней отображает страницы" ©

fortuna

21.03.2013 - 15:14

SerginhoLD
Спасибо но у меня всё равно не так вышло как хотелось .
Вот хочу как на этом сайте , только нужно выдернуть , я уже перепробовал кучу вариантов , то не так сяк .
Может кто посмотрим ?
перейти на сайт

sign63

21.03.2013 - 15:23

Все правильно, вот что у них в CSS


background: url("/img/new-model-page/property-dot.png") repeat-x scroll 0 11px transparent
;

это те самые точки, они Репитятся по X.
а выравнивание по центру - это всегда

margin: 0 auto;

_____________
user posted image

fortuna

21.03.2013 - 15:44

Так я выше написал , но у меня не так всё работает , sign63
Скиньте полностью рабочий вариант если не трудно .
Чтобы вставить и посмотреть .

sign63

22.03.2013 - 12:00

https://www.dropbox.com/sh/a31sjh3mr9njuek/...3-22_115516.png

Вроде бы все...

_____________
user posted image

Быстрый ответ:

Здесь расположена полная версия этой страницы.