ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
13 сообщений из 13, страница 1 из 1
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38290880
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
Вот такой незамысловатый код:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
<html>
<head>
<style>
  body {font-family: Arial;}
  .gb_subjpnl {background: silver;}
  .gb_date {float: right; color: red; font-weight: bold;}
</style>
</head>

<body>
<div class=gb_subjpnl>
  test
  <span class=gb_date>01.01.2013</span>
</div>
</body>
</html>



Не пойму, почему дата выделенная красным цветом вылезает за рамки DIV-а?
Если убрать выравнивание по правому краю, то дата отрисовывается внутри блока...
Как сделать чтобы она оставалась внутри DIV-а, при этом оставаясь выравненной по правому краю?
...
Рейтинг: 0 / 0
07.06.2013, 18:13
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38290885
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
SQL-Talker,

а браузер какой? Сейчас попробовал в Опере, Хромом - всё нормально.
...
Рейтинг: 0 / 0
07.06.2013, 18:18
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38291568
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
user89,

На работе под winXP перепробовал в опере, хроме, ie6, ie8, везде указанная кривизна. Дома на ноуте под Win8 в хроме и встроенном ie все тип-топ, а под оперой - та же байда...
Прикрепил картинку.
...
Рейтинг: 0 / 0
09.06.2013, 03:03
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38291700
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Есть такая штука, доктайп называется. Первой строкой идёт именно он - <!DOCTYPE html>
...
Рейтинг: 0 / 0
09.06.2013, 14:45
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292074
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
SQL-Talker,

как правильно заметил st_st, надо указать доктайп.
 
Проверял на WinXP
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
<!DOCTYPE html>
<html>
<head>
<style>
  body {font-family: Arial;}
  .gb_subjpnl {background: silver;}
  .gb_date {float: right; color: red; font-weight: bold; display: inline;}
</style>
</head>

<body>
<div class=gb_subjpnl>
  test &#8744;
  <span class=gb_date>01.01.2013</span>
</div>
</body>
</html>

...
Рейтинг: 0 / 0
10.06.2013, 09:30
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292103
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
Все верно, с доктайпом почти на всех браузерах все корректно отображается.
Кроме IE6. Отмахнуться от него не могу - порядка 40% пользователей сидят на нем ((
...
Рейтинг: 0 / 0
10.06.2013, 09:52
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292147
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
SQL-Talker,

1. Добавить для спана смещение вверх margin-top:-17px;
2. Разметить с помощью таблицы
3. Попросить админов сделать групповую политику, что при входе в домен, у пользователей установился нормальный браузер
...
Рейтинг: 0 / 0
10.06.2013, 10:26
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292189
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
user89,

спасибо, дописал:
Код: html
1.
<!--[if IE]> <style>.gb_date {margin-top:-18px;}</style> <![endif]-->


вроде везде работает.

пункт 3 - было бы, конечно, идеально, но, к сожалению, нереализуемо, т.к. с приложением работает хотя и ограниченное кол-во пользователей, но все из разных организаций..
...
Рейтинг: 0 / 0
10.06.2013, 10:57
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292282
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
Я тут решил глянуть в сети как такие вещи реализованы и вот первое попавшееся: ссылка на форум
На форуме номер сообщения тоже обернут в спан, тоже выровнен в право и тоже находится внутри див-а и тем не менее в IE 6 отображается все правильно.

Хочу понять, почему? Почему в моем примере приходится подставлять костыль, а тут все нормально?
...
Рейтинг: 0 / 0
10.06.2013, 11:57
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292410
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
SQL-Talker,

если спан вынести за пределы родительского дива, то будет нормально
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
<!DOCTYPE html>
<html>
<head>
<style>
  body {font-family: Arial;}
  .gb_subjpnl {float:left; width:550px; height:20px; background-color:#8DD5EB;}
  .gb_date {float:left; width:90px; height:20px; text-align:right; background-color:#9C8DEB;} 
</style>
</head>
<body>
<div class=gb_subjpnl>test</div>
<span class=gb_date>01.01.2013</span>
</body>
</html>


З.Ы. А почему нельзя использовать верстку таблицами?
...
Рейтинг: 0 / 0
10.06.2013, 13:07
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292441
SQL-Talker
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SQL-Talker
Участник
user89,

В этом варианте фиксируется ширина, а хотелось бы обойтись без фиксирования.
Почему не таблица - тренируюсь в верстке только дивами ))
...
Рейтинг: 0 / 0
10.06.2013, 13:27
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292497
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
SQL-Talker,

тогда еще один внешний див
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
<!DOCTYPE html>
<html>
<head>
<style>
  body {font-family: Arial;}
  .gb_subjpnl {float:left; height:20px; background-color:#8DD5EB;}
  .gb_date {float:right; height:20px; text-align:right; background-color:#9C8DEB;} 
</style>
</head>
<body>
<div style="background-color:#8DD5EB; width:100%; height:20px;">
<div class=gb_subjpnl>test</div>
<span class=gb_date>01.01.2013</span>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
10.06.2013, 13:52
| Ответить | Цитировать | Написать  
[HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
    #38292854
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Абсолютное позиционирование так же никто не отменял...

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.gb_subjpnl {
	position: relative;
	background: silver;
}
.gb_date {
	position: absolute;
	top: 1px;
	right: 1px;
	color: red; 
	font-weight: bold;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div class='gb_subjpnl'>
	test
	<span class='gb_date'>01.01.2013</span>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
10.06.2013, 16:14
| Ответить | Цитировать | Написать  
13 сообщений из 13, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [HTML + CSS] Выровненненный по правому краю SPAN отрисовывается ниже блока DIV. ПОЧЕМУ??
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38292410&tid=1448243]:
 0ms
get settings:
 10ms
get forum list:
 18ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 159ms
get topic data:
 8ms
get forum data:
 2ms
get page messages:
 36ms
get tp. blocked users:
 1ms
others: 235ms
total:  475ms
созд. / загр.: 475ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]