Форум Сайтостроение Веб-строительство

CSS задачка

12
[Удален]
947

Уже полдня мучаю простейший код

Есть DOCTYPE HTML 4.01

И DIV с float: left; В него необходимо вложить другой DIV высотой 1px шириной 100%

Все ведут себя нормально, а любимый IE width: 100% не видит 


		<div style="float: left; border: 1px solid #000;">

				Куча текста

				<div style="width: 100%; height: 1px; border: 1px solid #000;">&nbsp;</div>

				Куча текста

		</div>

Убираю width: 100%; height: 1px; и вместо height: 1px; пишу font-size: 1px; line-height: 1px;

Теперь chrom складывет вместе font-size и line-height имеем высоту 2px 


		<div style="float: left; border: 1px solid #000;">

				Куча текста

				<div style="font-size: 1px; line-height: 1px; border: 1px solid #000;">&nbsp;</div>

				Куча текста

		</div>

Ладно, не проблема. line-height: 1px; ставлю line-height: 0; Ура хром победили, но теперь все остальные показывают высоту Дива 0px 


		<div style="float: left; border: 1px solid #000;">

				Куча текста

				<div style="font-size: 1px; line-height: 0; border: 1px solid #000;">&nbsp;</div>

				Куча текста

		</div>

Вот теперь сижу и смотрю на это все как сделать, не создавая отдельного css файла для ie

•1
На сайте с 17.11.2007
Offline
17
•Kar1ss0n•
#1
strausenok:
Уже полдня мучаю простейший код
Есть DOCTYPE HTML 4.01
И DIV с float: left; В него необходимо вложить другой DIV высотой 1px шириной 100%

Все ведут себя нормально, а любимый IE width: 100% не видит
[cod]
<div style="float: left; border: 1px solid #000;">
Куча текста
<div style="width: 100%; height: 1px; border: 1px solid #000;">&nbsp;</div>
Куча текста
</div>
[/cod]

Не совсем понятна задача.

Попробуй вместо дива который (не видит ИЕ) поставить

[cod]

<body>

<div style="width:100%;float: left; border: 1px solid #000;">

Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста

<p style="margin:0; padding:0; height:1px; border: 1px solid #000;"></p>

Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста Куча текста

</div>

</body>

[/cod]

Спокойствие, только спокойствие ... посмотрим, что можно сделать © xHTML вёрстка (/ru/forum/272377)
eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие
[Удален]
#2

<?xml version="1.0" encoding="windows-1251"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="content-type" content="text/html;charset=windows-1251" />
<meta name="generator" content="Adobe GoLive" />
<title>Неозаглавленная страница</title>
<style type="text/css" media="screen"><!--
.class1 { width: 100%; float: left; border: solid 1px #666; }
.class2 { color: #222; font-size: 1px; line-height: 1px; background-color: #222; width: 100%; height: 1px; display: block; }
--></style>
</head>

<body>

<div class="class1">
Куча текста
<span class="class2">&nbsp;</span>
Куча текста
</div>

</body>

</html>

сляпал на скорую руку )))

[Удален]
#3
KosoyRoman:
сляпал на скорую руку )))

height: 1px - после этого в IE див перестает тянуться.

[Удален]
#4

strausenok блин я проверил во всех браузерах работает IE6 FireFox Opera

[Удален]
#5
•Kar1ss0n•:
Не совсем понятна задача.
Попробуй вместо дива который (не видит ИЕ) поставить

<p> работает но в IE растягивает внешний Див на 100%

KosoyRoman:
сляпал на скорую руку )))

height: 1px - после этого в IE див перестает тянуться.

Varkolak
На сайте с 03.06.2005
Offline
174
Varkolak
#6

KosoyRoman, а у вас

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

а у тс

DOCTYPE HTML 4.01

видимо из-за этого у вас все норм.

html/css/js верстка и разработка сайтов на hostcms (хостцмс) - skype: varkolak1, тел: 89675012935, e-mail: anton.yurzanov@gmail.com
a.fatman
На сайте с 15.01.2006
Offline
127
a.fatman
#7

А чем вам <hr /> не угодил? Вы же его пытатесь изобразить, как я понял?

[Удален]
#8

Фигней какой-то занимаетесь. Растяните внешний див на 100% если вам так надо, и используйте border

•1
На сайте с 17.11.2007
Offline
17
•Kar1ss0n•
#9
strausenok:
<p> работает но в IE растягивает внешний Див на 100%

а какая ширина нужна для внешнего дива?

rasiell
На сайте с 16.02.2008
Offline
180
rasiell
#10

Попробуйте так 

        <div style="float: left; width:100%; border: 1px solid #000;">

                Куча текста

                <div style="font-size: 1px; line-height: 0; height: 1px; border: 1px solid #000;">&nbsp;</div>

                Куча текста

        </div>
Zerber (http://spartanets.ru/zerber) — программа для публикации статей в различные CMS и блогсервисы
12

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