Минимальная ширина.
Ситуация такая:
Есть резиновый сайт, полностью сверстанный блоками. Если окно браузера больше 800px, то все шоколадно, но как только становится меньше - все ползет.
Выходы:
1. Для каких браузеров будет работать min-width? (версии браузеров тоже интересуют)
2. Какие костыли можно придумать или есть общепринятые решения проблемы? (например, прозрачный гиф шириной 800px)
Буду безмерно благодарен за ответ по существу. Спасибо!
Есть резиновый сайт, полностью сверстанный блоками. Если окно браузера больше 800px, то все шоколадно, но как только становится меньше - все ползет.
Выходы:
1. Для каких браузеров будет работать min-width? (версии браузеров тоже интересуют)
2. Какие костыли можно придумать или есть общепринятые решения проблемы? (например, прозрачный гиф шириной 800px)
Буду безмерно благодарен за ответ по существу. Спасибо!
У меня вот тоже похожая трабла, а не мог бы ты дать краткое описание этого min-width.:eek: :D
http://www.w3.org/TR/CSS21/visudet.html#propdef-min-width
Я так понимаю, что сие не работает в ИЕ, а также в старых версиях других браузеров.
Вопросы задал выше. С нетерпением жду ответа, спасибо!
Я так понимаю, что сие не работает в ИЕ, а также в старых версиях других браузеров.
Вопросы задал выше. С нетерпением жду ответа, спасибо!
Тоже как-то нужно было использовать min, помыкался - нормально не отображается. Поставил распорку - белый gif 1xWidth и поставил у него style="visibility:hidden". Все Ok
[QUOTE=r000n_m]Тоже как-то нужно было использовать min, помыкался - нормально не отображается. Поставил распорку - белый gif 1xWidth и поставил у него style="visibility:hidden". Все Ok[/QUOTE]
Единственное правильное решение. Ставьте распорки!
Единственное правильное решение. Ставьте распорки!
Чиорт! Так и знал.
Спасибо всем большое!
Спасибо всем большое!
[QUOTE=Комаджу]Чиорт! Так и знал.
Спасибо всем большое![/QUOTE]
Не спешите ставить распорки. min-width, похоже, не понимает только IE. Однако свойство width в нем ведет себя точно также, как min-width.
* width: 300px; (IE до 7 не понимает комментария *)
min-width: 300px;
Также можно использовать expression:
min-width: 760px;
max-width: 1000px;
width: expression((documentElement.clientWidth||document.body.clientWidth)<760?'760px': ((documentElement.clientWidth||document.body.clientWidth)>1000?'1000px':'auto'));
Спасибо всем большое![/QUOTE]
Не спешите ставить распорки. min-width, похоже, не понимает только IE. Однако свойство width в нем ведет себя точно также, как min-width.
* width: 300px; (IE до 7 не понимает комментария *)
min-width: 300px;
Также можно использовать expression:
min-width: 760px;
max-width: 1000px;
width: expression((documentElement.clientWidth||document.body.clientWidth)<760?'760px': ((documentElement.clientWidth||document.body.clientWidth)>1000?'1000px':'auto'));
Нет, такой вариант не подходит - ширина страницы уже указана:
width:100%;
min-width:800px;
Если я ширину сменю на 800, то желаемый результат не будет достигнут. Но за идею - большое спасибо!
width:100%;
min-width:800px;
Если я ширину сменю на 800, то желаемый результат не будет достигнут. Но за идею - большое спасибо!
[QUOTE=Комаджу]Нет, такой вариант не подходит [/QUOTE]
Ну как так не подходит?
Ну как так не подходит?
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
html, body {
width: 100%;
margin: 0;
padding: 0;
}
#wrapper {
color: #fff;
background-color: #f00;
width: 100%;
min-width: 800px;
width: expression((documentElement.clientWidth||document. body.clientWidth)<800?'800px':'100%');
}
</style>
</head>
<body>
<div id="wrapper">
<h1>Минимальная ширина блока 800px</h1>
</div>
</body>
</html>
<html>
<head>
<title></title>
<style type="text/css">
html, body {
width: 100%;
margin: 0;
padding: 0;
}
#wrapper {
color: #fff;
background-color: #f00;
width: 100%;
min-width: 800px;
width: expression((documentElement.clientWidth||document. body.clientWidth)<800?'800px':'100%');
}
</style>
</head>
<body>
<div id="wrapper">
<h1>Минимальная ширина блока 800px</h1>
</div>
</body>
</html>
Ой, что вы! Распорки, по крайней мере, валидные - а этот код не верный.
[QUOTE=Комаджу]Ой, что вы! Распорки, по крайней мере, валидные - а этот код не верный.[/QUOTE]
Вам шашечки, или ехать? (с)
Вам шашечки, или ехать? (с)
Ну, в общем-то, прошу прощения за флуд - мне ехать на шашечках. Что ясно из предыдущего поста - мой код будет проверяться очень внимательно специальными строгими мужчинками в черные костюмах и черных очках, поэтому валидность критична
*и заплакал*
*и заплакал*
[QUOTE=Комаджу] мой код будет проверяться очень внимательно специальными строгими мужчинками в черные костюмах и черных очках, поэтому валидность критична
*и заплакал*[/QUOTE]
8-) Как у вас все серьезно-то.
Держите валидный код:
*и заплакал*[/QUOTE]
8-) Как у вас все серьезно-то.
Держите валидный код:
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
html, body {
width: 100%;
margin: 0;
padding: 0;
}
#wrapper {
color: #fff;
background-color: #f00;
width: 100%;
min-width: 800px;
}
</style>
</head>
<body>
<!--[if IE]><div id=wrapper style=" width: expression((documentElement.clientWidth||document. body.clientWidth)<800?'800px':'100%');
}"<![endif]-->
<!-- <![if !IE]> --><div id="wrapper"><!-- <![endif]> -->
<h1>test</h1>
</div>
</body>
</html>
<html>
<head>
<title>test</title>
<style type="text/css">
html, body {
width: 100%;
margin: 0;
padding: 0;
}
#wrapper {
color: #fff;
background-color: #f00;
width: 100%;
min-width: 800px;
}
</style>
</head>
<body>
<!--[if IE]><div id=wrapper style=" width: expression((documentElement.clientWidth||document. body.clientWidth)<800?'800px':'100%');
}"<![endif]-->
<!-- <![if !IE]> --><div id="wrapper"><!-- <![endif]> -->
<h1>test</h1>
</div>
</body>
</html>
Извините за флуд, но Carpus - респект. Сразу видно профессионала.
Только в этом варианте есть солидный минус - мой ИЕ блокирует эту запись :(
Но мысль очень интересная, а главное - все выглядит так, как должно. Но этот минус для меня критичен.
Но мысль очень интересная, а главное - все выглядит так, как должно. Но этот минус для меня критичен.
такие хаки работают когда документ открывается по протаколу _http://
т.е. _http://сайт.ру/документ.хтмл заработает, а документ.хтмл заблокируется.
[color=grey]
еще один глюк осла, за который спасибо мелкомягким[/color]
т.е. _http://сайт.ру/документ.хтмл заработает, а документ.хтмл заблокируется.
[color=grey]
еще один глюк осла, за который спасибо мелкомягким[/color]
[QUOTE=skywalker]такие хаки работают когда документ открывается по протаколу _http://
т.е. _http://сайт.ру/документ.хтмл заработает, а документ.хтмл заблокируется.
[color=grey]
еще один глюк осла, за который спасибо мелкомягким[/color][/QUOTE]
Т.е. на сайте все будет ОК, это глюк локального просмотра страницы? Или как?
т.е. _http://сайт.ру/документ.хтмл заработает, а документ.хтмл заблокируется.
[color=grey]
еще один глюк осла, за который спасибо мелкомягким[/color][/QUOTE]
Т.е. на сайте все будет ОК, это глюк локального просмотра страницы? Или как?
[QUOTE=Комаджу]Т.е. на сайте все будет ОК, это глюк локального просмотра страницы? Или как?[/QUOTE]
Да.
Просто попробуй дома, например введи:
хттп://локалхост/адрес
И все будет правильно отображаться.
Да.
Просто попробуй дома, например введи:
хттп://локалхост/адрес
И все будет правильно отображаться.