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

Как сделать "резиновый" дизайн

12
Links Forever
На сайте с 20.08.2006
Offline
329
Links Forever
7308

Есть сайт, нужно сделать так, чтобы он растягивался на разрешение 1280 точек (но не шире!), при этом сжимался, если у пользователя 1024 точки. Как это сделать?

Еслт сайт обрамляю таблицей: 

<table align="center" width="1250"><tr><td>

То при разрешении 1024 он идет с прокруткой, что недопустимо, если использую без таблицы, то при разрешениях более 1250 точек он тоже растягивается на весь экран. Что-то в голову ничего не приходит. Как сделать?

Я очень люблю вкусные рецепты (https://povar24.info) квашеной капусты (https://kvashenaya-kapusta.ru/) и салат оливье (https://salatolive.ru/).
_
На сайте с 09.06.2008
Offline
158
_voland_
#1

в коде 

<body>

  <div id="wrapper">

  </div>

</body>

в css 

#wrapper {min-width:1000px;	max-width:1400px; margin:0 auto;background: url("../images/back.png") repeat;}

в css для IE 

#wrapper {

	width:expression((document.documentElement.clientWidth > 1400) ? "1400px" : (document.documentElement.clientWidth < 1000) ? "1000px" : document.documentElement.clientWidth ); 

}
Настраиваю напильником Joomla 1.5 (http://joomla15.ru) Если постоянно взламывают движок, достаточно сменить хостинг (http://2s4.ru/ytx) всем СРОЧНО (14 дек) обновлять или патчить joomla-сайты (/ru/forum/919351)
Links Forever
На сайте с 20.08.2006
Offline
329
Links Forever
#2

Спасибо. Как раз через яву и сделал.

_
На сайте с 09.06.2008
Offline
158
_voland_
#3
_alk0g0lik_:
Спасибо. Как раз через яву и сделал.

А где тут Ява-скрипт? Только для IE применяется ибо это чудовище не понимет min\max-width

Links Forever
На сайте с 20.08.2006
Offline
329
Links Forever
#4
_voland_:
А где тут Ява-скрипт? Только для IE применяется ибо это чудовище не понимет min\max-width

Вот как я сделал: 

<style type="text/css">

.main {width="1250";}

</style>

<table align="center" id="main" style="width:100%;"><tr><td>

<script language="javascript" type="text/javascript">

<!--

function getClientWidth()

{

  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;

}

var main_body_size = getClientWidth();



if (main_body_size > 1290) document.getElementById('main').style.width = "1250px";



//-->

</script>
_
На сайте с 09.06.2008
Offline
158
_voland_
#5
_alk0g0lik_:
Вот как я сделал: 

<style type="text/css">

.main {width="1250";}

</style>


<table align="center" id="main" style="width:100%;"><tr><td>


<script language="javascript" type="text/javascript">

<!--

function getClientWidth()

{

  return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;

}

var main_body_size = getClientWidth();



if (main_body_size > 1290) document.getElementById('main').style.width = "1250px";



//-->

</script>

Ужас! А если у пользователя отключен JS? Да и если включен пока страница грузится он увидит не то что надо, учиться надо ☝

Links Forever
На сайте с 20.08.2006
Offline
329
Links Forever
#6
_voland_:
Ужас! А если у пользователя отключен JS? Да и если включен пока страница грузится он увидит не то что надо, учиться надо ☝

Ну, если отключен - значит не судьба, а по поводу загрузки страницы, то можно просто скрипт сразу после body поместить и все ОК

J
На сайте с 13.11.2008
Offline
155
JIucky
#7

ТС сделайте как вам посоветовал _voland_, и будет вам щастие :)

ПЗ
На сайте с 10.10.2006
Offline
92
Павел Зотов
#8
_alk0g0lik_:
Вот как я сделал: 

<style type="text/css">

.main {width="1250";}

</style>


<table align="center" id="main" style="width:100%;"><tr><td>

Жесть. Возьмите любой учебник по цсс, посмотрите хотя бы основы.


if (main_body_size > 1290) document.getElementById('main').style.width = "1250px";

вот это не сработает сразу после body, т.к. getElementById('main') будет undefined

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

Автомобили в России (http://www.autobb.ru/). Спецтехника BIZ - вся строительная, дорожная, коммунальная техника (http://www.spectehnika.biz/) и другая спецтехника в одном месте.
Продвижение большого количества НЧ Продвижение цветочного сайта в Чем недорого улучшить компьютер
Николай В.
На сайте с 07.09.2006
Offline
62
Николай В.
#9
_voland_:
А если у пользователя отключен JS?

Экспрешены тоже не заработают, если JS отключен, т.к. они — это он.

Links Forever
На сайте с 20.08.2006
Offline
329
Links Forever
#10
Павел Зотов:
Жесть. Возьмите любой учебник по цсс, посмотрите хотя бы основы.



вот это не сработает сразу после body, т.к. getElementById('main') будет undefined


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

А что в моем не верно, оно прекрасно работает!

12

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