Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.75/16: Рейтинг темы: голосов - 16, средняя оценка - 4.75
EK
8 / 8 / 0
Регистрация: 16.02.2012
Сообщений: 381
1

Стилизация hr

30.07.2012, 13:21. Показов 2953. Ответов 8
Метки нет (Все метки)

Здрасте!

Вот написал я такой код
HTML5
1
2
3
4
<div id="header">
  <div class="text">Привет!!!</div>
</div>
<hr>
CSS
1
2
3
4
5
* {margin:0; padding:0;}
body {width:1435px; height:786px; background:#DEB887;}
#header {padding:100px 0px; color:#00FFFF;}
.text {width:200px; margin:30px 600px; text-align:center; color:#6495ED; font:bold 21px Comic sans ms;}
hr {width:330px; height:5px; background:red; margin-left:540px;}
и надеялся, что красная полоска hr будет прямо под надписью привет, а между ей и приветом - большущее расстояние.

Вот почему так?
0

Помощь в написании контрольных, курсовых и дипломных работ здесь.

Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
30.07.2012, 13:21
Ответы с готовыми решениями:

Стилизация
Всем привет ! не могу никак отстилизовать последнего кота. Через опасити не получается т.к....

Стилизация checkbox
Как дать стиль checkbox, чтобы у него было примерно вот такой стиль? Помогите пожалуйста. Чтобы...

Стилизация таблицы
Всем доброго вечера. Подскажите пожалуйста, как сделать класс таблицы, чтобы стили применились...

Стилизация input
Доброго времени суток! Есть задача стилизовать input, а именно сделать его прозрачным. делаю...

8
tribal dance
167 / 155 / 36
Регистрация: 03.09.2009
Сообщений: 820
Записей в блоге: 17
30.07.2012, 13:36 2
CSS
1
padding:10000px auto;
0
EK
8 / 8 / 0
Регистрация: 16.02.2012
Сообщений: 381
30.07.2012, 13:41  [ТС] 3
Не сработало
0
Администратор
11922 / 5226 / 265
Регистрация: 05.04.2011
Сообщений: 14,010
Записей в блоге: 2
30.07.2012, 15:01 4
CSS
1
#header {padding:100px 0px; color:#00FFFF;}
вы задали отступ с двух сторон - сверху и снизу

надо так
CSS
1
#header {padding:100px 0 0; color:#00FFFF;}
Если отступ нулевой - пиксели не пишем

http://htmlbook.ru/css/padding
0
EK
8 / 8 / 0
Регистрация: 16.02.2012
Сообщений: 381
30.07.2012, 15:40  [ТС] 5
Все равно не сработало.
Можно, конечно, решить проблему с помощью border-bottom, но хотелось бы понять, что не так с hr.
Может, ее вообще, нельзя поднять вплотную к надписи?
Сейчас дело обстоит вот так: http://blacktorn.16mb.com/My_site.html
0
Администратор
11922 / 5226 / 265
Регистрация: 05.04.2011
Сообщений: 14,010
Записей в блоге: 2
30.07.2012, 15:47 6
То же самое и для маргинов - проверяйте

Должно быть для .text

CSS
1
margin: 30px 600px 0;
1
Эксперт JSЭксперт HTML/CSS
2430 / 1108 / 310
Регистрация: 23.06.2011
Сообщений: 3,487
30.07.2012, 20:56 7
Цитата Сообщение от EK Посмотреть сообщение
что не так с hr.
Почитай тут, может чего полезного найдешь, тег ХР не так прост.
У них же, Кроссбраузерный hr
И другие ссылки...
1
Oleg50
01.08.2012, 18:11 8
margin:30px 600px 0; вот так сделай и не будет никакого растояния
899 / 832 / 197
Регистрация: 28.06.2012
Сообщений: 1,607
Записей в блоге: 4
01.08.2012, 21:50 9
Внесите hr в блок text и уберите для hr
CSS
1
margin-left:540px;
ширину блока и линии уровняйте:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
* {margin:0; padding:0;}
body {width:1435px; height:786px; background:#DEB887;}
#header {padding:100px 0px; color:#00FFFF;}
.text {width:330px; margin:30px 600px; text-align:center; color:#6495ED; font:bold 21px Comic sans ms;}
hr {width:330px; height:5px; background:red; }
 
 
</style>
</head>
<body>
<div id="header">
  <div class="text">Привет!!!<hr></div>
</div>
 
</body>
</html>
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
01.08.2012, 21:50

стилизация формы
есть такой код в форме отправки &lt;div class=&quot;form-group&gt; &lt;input class=&quot;form-control&quot;...

Стилизация таблицы
Здравствуйте. Пытаюсь стилизовать таблицу: &lt;table&gt; &lt;tr&gt; &lt;th&gt;№&lt;/th&gt; &lt;th&gt;Название&lt;/th&gt;...

Стилизация селекта
Привет всем. Сейчас занимаюсь стилизацией селекта. Я попытался заменить выпадающий список...

Стилизация списка
Стоит задача стилизовать список как на прикрепленном изображении (т.е. стилизовать нужно именно...

Стилизация кнопок
Можно ли как-нибудь поменять кнопку &lt;input type=&quot;file&quot; name=&quot;attach&quot;&gt; на свою картинку? такой же...

Стилизация select
всем привет, подскажите пожалуйста, как сделать такой select , как на картинке &lt;select...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
9
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.