Jump to content
  • 0

Ровно посерединке


Metus
 Share

Question

Итак, многие из нас делают сайты.

Очень часто вся информация располагается в единственном блоке, позиционированным горизонтально по центру.

Как позиционируется: горизонтальным выравниванием или таблицей из трёх столбцов - неважно.

При этом, на смаом сайте страницы имеют разное по-объёму содержание:

Порой страница вмещается по вертикали без прокрутки, а порой уходит далеко вниз, при этом появляется боковой ползунок прокрутки и наш центральный блок начинает поизиционироваться с учётом уменьшившейся области браузера.

То есть при переходе с "маленькой" страницы на "большую" наш центральный блок "прыгает" влево, что, порой неочень.

И вот мне интересно, есть ли какой-нибудь изящный способ избежать этого?

Edited by Metus
Link to comment
Share on other sites

12 answers to this question

Recommended Posts

  • 0

я не про то.

Скажу проще.

Можно ли сделать так, чтобы блок остался на том же месте, в том же положении и состоянии для пользователя, если появляется боковая полоса прокрутки?

absolutе тебе в помощь

Хотя можно и margin-ом его отодвинуть сразу от левого края. Короче сделать заранее отступ нужный.

Link to comment
Share on other sites

  • 0

а можно чуть-чуть поподробнее?

вот одна страница есть, по вертикали влезает.

вот есть другая и не влезает -> появляется боковая полоса прокрутки -> уменьшается клиентская область -> позиционирование идёт относительно уменьшившейся клиентской области -> весь кусок на мониторе сдвигается влево, что выглядит неочень.

Я, пока, кроме способа Ява-скриптом как-то высчитать ширину полосы прокрутки и поставить ширину правому столбцу таблицы не вижу (то есть позиционируем тремя столбцами, у них ширина: auto; 900px(например); auto; )

а после этого определяем ширину двух крайних столбцов и вычитаем из ширины правого ширину полосы прокрутки

Тогда вопрос: как определить ширину полосы прокрутки?

Added:

Нашёл 1 способ только адекватный.

сразу после <body> определяем его ширину, создаём переменную.

перед <body> снова определяем его ширину.

Если не совпадают, левому столбцу задаём жёстко ширину, которая была для него рассчитана, а правому такую же минус разность значений ширины body.

Edited by Metus
Link to comment
Share on other sites

  • 0

Тут только вопрос в том, как к этому заказчик отнесётся - может не заметит, а если заметит, то норм, а может наоборот.

И сразу вопрос: как задать неактивную полосу? :o

Не пойдёт?

http://htmlbook.ru/css/overflow-x'>http://htmlbook.ru/css/overflow-x

http://htmlbook.ru/css/overflow-y'>http://htmlbook.ru/css/overflow-y

http://htmlbook.ru/css/overflow

Link to comment
Share on other sites

  • 0

если в опереде 9.2 совсем не работает, то, увы не пойдёт (в т.з. всегда опера начиная с 9.0)

но с другой стороны, те кто сидят на ней - обойдутся)) Не велика потеря, в принципе

Спасибо большое! =)

Edited by Metus
Link to comment
Share on other sites

  • 0

если в опереде 9.2 совсем не работает, то, увы не пойдёт (в т.з. всегда опера начиная с 9.0)

но с другой стороны, те кто сидят на ней - обойдутся)) Не велика потеря, в принципе

Да, какой ужас. Ведь ещё целых 1.6% :o

http://www.liveinternet.ru/stat/ru/browsers.html?period=month

Link to comment
Share on other sites

  • 0

И вот мне интересно, есть ли какой-нибудь изящный способ избежать этого?

Мне помогло это http://www.html.by/threads/18236-Skroll-prygaet-lja-centralnogo-bloka?p=109311#post109311 решение

Но там еще есть некоторые проблемки, которые я пока не решил.

Link to comment
Share on other sites

  • 0

Считать "прыгание" блока влево из-за появления полосы прокрутки - просто тупо. Я бы от такого заказчика держался подальше ибо количество идиотских требований у них, как правило, со временем только увеличивается.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy