Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель PHP 5 / 6 (3 издание). Авторы: Кузнецов М.В., Симдянов И.В. Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Центрирование
 
 автор: Владимир55   (24.11.2011 в 14:32)   письмо автору
5.4 Кб
 
 

В стилях задано


p { 
    margin-top:     0pt; 
    margin-bottom:  0pt; 
    margin-right:   10px; 
    margin-left:    10px; 
    font-family:    Arial, Helvetica, sans-serif; 
    font-size:      16px; 
    font-style:     normal; 
    line-height:    25px; 
    font-weight:    normal; 
    font-variant:   normal; 
    text-transform: none; 
    text-align:     justify;     
   text-indent:    25px; 
    line-height:    100%; 
    color:             #000080; 
}
H1 { 
    text-align:     center; 
    font-size:      18px; 


.otz { 
    text-align:     center; 
    font-size:      18px; 


Делаю тестовый код:
<p class="otz">ЦЕНТР1</p>
<H1>ЦЕНТР2<H1>


А получаю какртинку, приведенную во вложении.

Почему строки по разному центрируются?

  Ответить  
 
 автор: cheops   (24.11.2011 в 16:31)   письмо автору
 
   для: Владимир55   (24.11.2011 в 14:32)
 

Это из-за
text-indent:    25px; 
уберите его или задайте для этого свойства 0 явно в <p> через атрибут style и они выравняются.

  Ответить  
 
 автор: Владимир55   (24.11.2011 в 17:09)   письмо автору
 
   для: cheops   (24.11.2011 в 16:31)
 

Как ни удивительно, но обнуление (или удаление) text-indent ситуацию не изменило.

Однако, текст центрируется правильным образом, если удалить из стилей p:

или
margin-top:     0pt;

или
margin-bottom:  0pt; 


Но ведь без них не обойтись, ибо тогда страдает остальной текст!

Замена 0pt на 0px не повлияла.

Так тоже пробовал (безрезультатно):
.otz { 
    text-align:     center; 
    font-size:      18px; 
    text-indent:     0px; 

Что тут ещё можно сделать?

  Ответить  
 
 автор: cheops   (24.11.2011 в 17:19)   письмо автору
 
   для: Владимир55   (24.11.2011 в 17:09)
 

>Как ни удивительно, но обнуление (или удаление) text-indent ситуацию не изменило.
В каком браузере тестируете?

Вообще есть хороший прием - добавлять отладочные границы при помощи border: 1px solid black, с их помощью, легче ориентироваться в разметке.

  Ответить  
 
 автор: Владимир55   (24.11.2011 в 17:37)   письмо автору
 
   для: cheops   (24.11.2011 в 17:19)
 

Эксплорер 8 и ФФ - одинаково.

  Ответить  
 
 автор: AlexSol   (24.11.2011 в 17:40)   письмо автору
 
   для: Владимир55   (24.11.2011 в 17:37)
 

после кода соц.сетей натыкайте переносов строк парочку

  Ответить  
 
 автор: Владимир55   (24.11.2011 в 17:48)   письмо автору
 
   для: AlexSol   (24.11.2011 в 17:40)
 

Спасибо, учту. Это тест - никак заголовок не отцентрирую. От этих стилей - одна морока...

  Ответить  
 
 автор: AlexSol   (24.11.2011 в 17:59)   письмо автору
 
   для: Владимир55   (24.11.2011 в 17:48)
 

учтите. т.к. они место и съедают. http://floomby.ru/content/85taapGBEm

  Ответить  
 
 автор: Владимир55   (24.11.2011 в 18:05)   письмо автору
 
   для: AlexSol   (24.11.2011 в 17:59)
 

С ума сойти можно! Вот уж ни за что бы не догадался!

Да, действительно, именно в этом всё и дело!

Спасибо!

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования