Jump to content
  • 0

Верстка полурезины


Dioni$$
 Share

Question

Вобщем надо сверстать макет. Он отрисован на 1260 пикселей. Задуман как резина - но контентная часть фиксированная на 1000 пикселей.

То есть при разрешении 1280 и выше никаких проблем. А при разрешении менее 1280 нужно чтоб часть фона (картинка) отрезалась.

Для наглядности приложу скрин.

http://i080.radikal.ru/1004/8d/a23ce6e9d77e.jpg

Можно ли такое сделать вообще? Не могу придумать :unsure:

Link to comment
Share on other sites

17 answers to this question

Recommended Posts

  • 0
Вобщем надо сверстать макет. Он отрисован на 1260 пикселей. Задуман как резина - но контентная часть фиксированная на 1000 пикселей.

То есть при разрешении 1280 и выше никаких проблем. А при разрешении менее 1280 нужно чтоб часть фона (картинка) отрезалась.

Для наглядности приложу скрин.

http://i080.radikal.ru/1004/8d/a23ce6e9d77e.jpg

Можно ли такое сделать вообще? Не могу придумать :unsure:

Сделай общий контейнер ДИВ, задай ему минималку 1000пк, и оверфлоу:хайден.

Link to comment
Share on other sites

  • 0
Вобщем надо сверстать макет. Он отрисован на 1260 пикселей. Задуман как резина - но контентная часть фиксированная на 1000 пикселей.

То есть при разрешении 1280 и выше никаких проблем. А при разрешении менее 1280 нужно чтоб часть фона (картинка) отрезалась.

Для наглядности приложу скрин.

http://i080.radikal.ru/1004/8d/a23ce6e9d77e.jpg

Можно ли такое сделать вообще? Не могу придумать :unsure:

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

Вроде встречал как-то решение тут на форуме, psywalker, не помнишь? Мишка2 чтоле приводил?

Link to comment
Share on other sites

  • 0
Кажись такое только трехколоночной таблицей либо дивами, преврашенными в таблицу.

Вроде встречал как-то решение тут на форуме, psywalker, не помнишь? Мишка2 чтоле приводил?

Я выше описал его

Link to comment
Share on other sites

  • 0
Сделай общий контейнер ДИВ, задай ему минималку 1000пк, и оверфлоу:хайден.

Спасибо.

Но при не полностью развернутом окне браузера возникает момент когда картинка не полностью спряталась и не совпадает. Возможно ли как то решить эту проблему?

или я что-то не так делаю?

Edited by Dioni$$
Link to comment
Share on other sites

  • 0
Спасибо.

Но при не полностью развернутом окне браузера возникает момент когда картинка не полностью спряталась и не совпадает. Возможно ли как то решить эту проблему?

или я что-то не так делаю?

Наверняка что-то не так... если картинки идут бэком то боковым картинкам я бы указал

С лева:
background-position: right bottom;
С права:
background-position: left bottom;

Link to comment
Share on other sites

  • 0
Наверняка что-то не так... если картинки идут бэком то боковым картинкам я бы указал

С лева:
background-position: right bottom;
С права:
background-position: left bottom;

Я понял о чем вы но не могу понять как это организовать в целом :unsure:

Хотелось бы добиться эффекта как вот здесь например _http://l2ready.ru/.

То есть сайт центрируется а картинка обрезается до самой контентной части. И горизонтальная прокрутка не появляется. Там на таблицах. Можно ли так на дивах? И главное - как?

Подскажите плиз.

Link to comment
Share on other sites

  • 0
klierik, я так понял это ты верстал.

Если да, то можешь обьяснить зачем такой изврат емный? Ну тоесть все размеры в em

Я знаю этого парня, как никто другой и могу смело ответить за него, что у него такой стиль, т.е. всё задавать в em, типа эластичные блоки и т.д. Я сам долго сидел на такой системе, сейчас слез с неё, оставил в основном только шрифт. :unsure:

Link to comment
Share on other sites

  • 0

стиль стилем, я ж непротив.

Но вот шрифт маловат... мне видно плохо, и я решил увеличу ка я его... Браузер FF в настройках - ресайзить только текст...

Просто я например невижу причин на таком дизе все задавать в ем... Ну кроме такой причины как необоснованный фанатизм. Ктото когдато сказал что ем это круто.

Да что там далеко ходить... шрифты в емах задают для ие. Так как у него есть такое "вид -> размер шрифта" и там выбираем какой шрифт нужен. Понятно что у людей с плохим зрением стоит - самый большой размер шрифта. По умолчанию - средний. Кто уменьшает шрифт я даже немогу представить. Еще не слышал чтобы шрифт на сайте по дефолту был большим, и юзер его так вот уменьшал.

Смысл емной верстки(все размеры в ем) - чтобы при изменении размера шрифта, именно шрифта - ресайзилась вся страничка. Меняют размер шрифта обычно в большую сторону.

Попробуйка в ие изменить размер шрифта на этой вот страничке http://www.pyatnitca.com/

Edited by mishka2
Link to comment
Share on other sites

  • 0

Ну да, я в принципе согласен. Раньше тоже ведь думал иначе, просто дело в том, что в em нужно задавать размеры по уму, т.е. смотреть результат этого эффекта, постоянно проверять, так как часто бывает, что эти "Крутости" ни к чему хорошему не приведут, а сделают только хуже и все старания коту под хвост. А про дефолтный размер я для себя решил отталкиваться не от 10пк, а от 12пк, так как последнее нормально читается, в отличии от первого.

Link to comment
Share on other sites

  • 0
Да, это же фигня там какая-та, просто тупо картинка по центру и минималка стоит 1000пк

background: url(images/main.jpg) no-repeat center top;

да - там фигня. да еще и таблицами. это был пример как должен себя вести сайт при изменении разрешения.

я видимо не понимаю но если использовать картинку и центрировать - это мне что фон размером в весь сайт делать? :)

тут вот попытка обойти эту ситуацию http://www.peoplecontent.ru/html/

но как видите картинка уходит под центральный блок, а мне нужно чтоб она уходила за пределы браузера.

а тут как выглядит сам макет _http://s48.radikal.ru/i121/1004/e5/de3e8381f26f.jpg

ногами плиз не бейте. подскажите как сделать.

не могу нигде найти (не знаю как у гугля спросить :) )

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