По сути все просто, но правления формату заменить "left" - "center" не помогают. Сам сайт Нужно выровнять модуль витрина, что бы категории отображались по-середине. Пример того что нужно исправить.
Подсказал бы точно строки, но у вас стили склеены в один файл, так что вот: HTML: .box-homepagecategorywall{ text-align: center; } .box-homepagecategorywall .homepagecategorywall{ float:none; } Изначально во втором правиле float:left, потому выравнивание по центру и не работает.
.box-content-home { margin-bottom: 20px; overflow: hidden; padding-top: 10px; background: #FFFFFF; } .box-homepagecategorywall { margin-left: 0px; } .box-homepagecategorywall .homepagecategorywall { display: inline-block; float: left; margin-bottom: 20px; margin-left: 0px; margin-right: 0px; vertical-align: top; text-align: left; width: 190px; height: 270px; } .box-homepagecategorywall img { padding: 3px; border: 1px solid #E7E7E7; } .box-homepagecategorywall h3 { text-align:left; margin: 0; } .box-homepagecategorywall h3 a { color: ##38B0E3; text-decoration: none; } .box-homepagecategorywall ul { list-style: none; margin: 0px; padding: 0; text-align: left; } .box-homepagecategorywall ul li { padding-top: 2px; } .box-homepagecategorywall ul a { text-decoration: none; color: ##38B0E3; } .box-homepagecategorywall .active { text-decoration: underline; } .box-homepagecategorywall ul a:hover { text-decoration: underline; } .box-homepagecategorywall > ul > li { float: left; padding: 8px 28px 8px 0px; } .box-homepagecategorywall > ul > li + li { } .box-homepagecategorywall > ul > li > a { text-decoration: none; color: #333; } .box-homepagecategorywall > ul > li ul { display: block; } .box-homepagecategorywall > ul > li a.active { font-weight: bold; font-size:12px; } .box-homepagecategorywall > ul > li a.active + ul { display: block; } .box-homepagecategorywall > ul > li ul > li { padding: 5px 5px 0px 10px; } .box-homepagecategorywall > ul > li ul > li > a { text-decoration: none; display: block; } .box-homepagecategorywall > ul > li ul > li > a.active { font-weight: bold; } .box-homepagecategorywall > ul > li ul > li ul > li a.active { font-weight: bold; color: #06bcc3; } .box-homepagecategorywall > ul > li ul > li ul > li a.active + ul { display: block; } .cover .homepagecategorywall { text-align: left; width: 190px; height: 210px; margin: 10px auto; overflow: hidden; position: relative; } .cover { } .cover img { position: absolute; top: 0; left: 0; border: 0; } .cover ul{ } .cover .homepagecategorywall { } .caption { margin-top: 3px; float: left; position: absolute; height: 200px; width: 165px; margin-left: 3px; padding: 5px; } .caption ul { padding:10px; width: 155px; } .caption h3{ margin-left:5px; margin-top:5px; } .caption ul a{ color:white; } .semigrey { background:#222; opacity: .9; filter: progidXImageTransform.Microsoft.Alpha(Opacity=90); } ________________________________________________________________________________ если я правильно понял - меняю в 3-й части float "left" на "none", text-align: left; - на center. (файл homepagecategorywall.css)
float можно просто удалить, а text-align: center нужно дописать в блок выше (.box-homepagecategorywall). Вам ведь нужно блоки категорий отцентровать, а не текст в них?
Да - мне нужно отцентровать цельный блок, а текст что бы оставался по левому краю блока. Прописал так .box-content-home { margin-bottom: 20px; overflow: hidden; padding-top: 10px; background: #FFFFFF; } .box-homepagecategorywall { margin-left: 0px; text-align: center; } .box-homepagecategorywall .homepagecategorywall { display: inline-block; margin-bottom: 20px; margin-left: 0px; margin-right: 0px; vertical-align: top; text-align: left; width: 190px; height: 270px; } _____________________________________________________________ Вроде получилось, но возник новый вопрос - вторая строка категорий, принявшая правило, также разместилась по-центру. Как вариант - сделать одинаковое количество категорий, но это не подойдет. Подскажите, реально ли сделать, что бы осталось так же по-центру, но начиналось с левого края. Или это типа абра-кадабра? Может как вариант выставить бордера в процентном соотношении?
Обычно в таких случаях при выводе блоков проверяют их номер и добавляют отдельный класс, который позволяет сделать подобное. Если нужно просто сделать равномерные отступы по краям, можно действительно ничего не центровать, а вручную выровнять содержимое через паддинг контейнера, например.
Если выглядит, как вы хотели, значит правильно: Кстати, для нулевых значений не обязательно указывать единицы измерения. Я про: Код: margin-left: 0px;