Как поставить таблицу с тарифами посередине странциы? Вопрос про верстку

C
На сайте с 21.10.2014
Offline
67
773

Здравствуйте.

Есть, вот, конструктор таблицы с тарифами для сайта.

Он дает такой код таблицы

HTML

<div id="pricing-table" class="pricing-table">

<ul>

<li class="heading">Bronze</li>

<li class="price">£20</li>

<li>Starter package</li>

<li>15 Projects</li>

<li class="action">Buy Now</li>

</ul>

<ul class="feature">

<li class="heading">Silver</li>

<li class="price">£60</li>

<li>Intermediate package</li>

<li>20 Projects</li>

<li class="action">Buy Now</li>

</ul>

<ul>

<li class="heading">Gold</li>

<li class="price">£80</li>

<li>Professional package</li>

<li>30 Projects</li>

<li class="action">Buy Now</li>

</ul>

</div>

CSS

.pricing-table ul{

border-width: 1px;

border-style: solid;

border-color: #CCCCCC;

border-radius: 3px;

margin: 3px;

width: 200px;

text-align: center;

list-style: none;

float: left;

padding: 0px;

background-color: #FFFFFF;

}

.pricing-table ul li{

padding: 5px;

background-color: #EFEFEF;

border-width: 2px;

border-color: #B83737;

border-radius: 0px;

border-bottom-width: 2px;

font-size: 14px;

}

.pricing-table li:nth-child(odd){

background-color: #F7F7F7;

}

.pricing-table ul .heading{

color: #FFFFFF;

background-color: #DF5D5D;

font-size: 16px;

}

Сайт на ВордПресс.

Подскажите, пожалуйста, как такую таблицу поставить посередине страницы?

Таблица по умолчанию встает по левому краю.

<div align="сenter"></div> не помогает.

Я, к сожалению, не бум-бум в верстке.

Как ее, таблицу, поставить посередине?

Спасибо!

Генератор идей для отдыха и развлечений (http://www.free-timer.com/)
A
На сайте с 04.11.2007
Offline
134
#1

Решение "в лоб"

<center>

<div id="pricing-table" class="pricing-table">

...

</div>

</center>

добавить в css

.pricing-table { display: inline-block; }

C
На сайте с 21.10.2014
Offline
67
#2

asteroid, получилось! )

Спасибо большое! ))

artemmian
На сайте с 27.12.2013
Offline
15
#3

.pricing-table{

margin:3px auto;

}

Заходите на мой сайт: http://artemmian.ru (http://artemmian.ru) и узнаете много интересного о DLE и мира IT
Ragnarok
На сайте с 25.06.2010
Offline
239
#4
artemmian:
.pricing-table{
margin:3px auto;
}

будет работать, если у <div class="pricing-table" .. задана ширина

//TODO: перестать откладывать на потом
K
На сайте с 03.06.2015
Offline
45
#5

Упавший давно <center> это ныне text-align:center и конечно таблицу придется приравнять к строке.

---------- Добавлено 21.07.2015 в 09:39 ----------

Ragnarok:
будет работать, если у <div class="pricing-table" .. задана ширина

Так задаст, обычно пишут 100% и все.

MYSQL PHP JS HTML CSS SEO TXT США СССР
artemmian
На сайте с 27.12.2013
Offline
15
#6
Ragnarok:
будет работать, если у <div class="pricing-table" .. задана ширина

width:100% или, дабы не прилипала к бордюрам - 96%

V
На сайте с 09.06.2015
Offline
2
#7

.pricing-table{

display: block;

margin:3px auto;

}

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий