Jump to content

Faradey99

Newbie
  • Posts

    18
  • Joined

  • Last visited

Everything posted by Faradey99

  1. Именно Выходит примерно следующее:
  2. float: left не подойдет, так как блоки будут разной высоты. Если бы была фиксированная высота, http://habrahabr.ru/qa/6067/ вот тут неплохое решение. Читал статью, как я понял этот способ тот же, что и http://forum.htmlbook.ru/index.php?showtopic=20735 , как я писал, уже пробовал, но при уменьшении ширины при неравном количестве блоков в одном ряду выравнивание проходит не как надо. Остаются еще таблицы, но не очень хотелось их использовать
  3. Здравствуйте! Помогите пожалуйста решить следующую задачу: Имеется макет (левая сторона - центр - правая сторона) с динамической шириной, в центральной части по всей ширине необходимо разместить несколько блоков с одинаковой шириной, но разной высотой, блоков должно быть 3 или 4 в одном ряду в зависимости от ширины. С разной высотой все ясно, будет использоваться: http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ , вопрос только как выравнять это все по ширине? Пробовал комбинировать с данным методом: http://forum.htmlbook.ru/index.php?showtopic=20735 , но получается совсем не то что хотелось бы.
  4. Блин, протупил, спасибо большое СЕВЕР!
  5. Поэтому я и спрашивал про position:absolute и z-index:-1, наверное я неправильно сформулировал вопрос, правильнее будет спросить стоит ли его здесь использовать или есть способ получше?
  6. Спасибо, работает Но, мне необходимо чтобы и верхний и нижний градиент были на заднем фоне (под div.wrapper) как на картинке:
  7. Или все содержимое body обернуть в ещё один блок, которому задать нижний фон? <!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=utf-8" /> <title></title> <style type="text/css"> * {margin:0;padding:0} body {background:url('top-bg.gif') repeat-x top left #F5F5F5} div.bottom-bg {background:url('bottom-bg.gif') repeat-x bottom left} div.wrapper { background:#FAFAFA; margin:0 auto; max-width:1280px; min-width:980px } </style> </head> <body> <div class="bottom-bg"> <div class="wrapper"> .... </div> </div> </body> </html>
  8. То есть, как я понял, body я задаю верхний градиент, а нижний градиент с помощью вложенного абсолютно позиционированного дива?
  9. Подскажите пожалуйста, как верстать такой фон? Сам я додумался только до такого: верхний фон - один блок, нижний фон - второй блок. Родительскому блоку (в данном случае <body>) задаю position:relative, а верхнему и нижнему фону задаю pozition:absolute и z-index:-1. В коде вот так: <!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=utf-8" /> <title></title> <style type="text/css"> * {margin:0;padding:0} body {background:#F5F5F5;position:relative} div.top-bg, div.bottom-bg {height:60px;position:absolute;width:100%;z-index:-1} div.top-bg {background:url('top-bg.gif') repeat-x top left} div.bottom-bg {background:url('bottom-bg.gif') repeat-x bottom left} </style> </head> <body> <div class="top-bg"></div> <div class="bottom-bg"></div> </body> </html>
  10. Правда это только для IE 6 и 7, Вы попробуйте масштаб поизменять
  11. Если прописать display:inline для IE то работает
  12. А не кто не пробовал изменять масштаб в IE7, 8?
  13. Спасибо большое, все получилось
  14. Помогите пожалуйста, есть резиновый макет с максимальной шириной 1280 и минимальной 980, есть три блока разной ширины, которые находятся на одном уровне, при изменении ширины центральный блок должен находится на равном расстоянии от левого и правого блока, то есть так: Сам я пробовал приблизительно следующее (не думаю что это хороший вариант): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote {margin:0;padding:0} div.wrapper { background:#F5F5F5; margin:0 auto; max-width:1280px; min-width:980px; padding:20px } div.block {border:1px solid #000;height:140px;position:relative} div.left, div.center, div.right {position:absolute} div.left, div.right {z-index:1} div.left { background:#FF0; height:68px; left:10px; top:40px; width:244px } div.center { background:#F00; height:46px; left:31%; top:62px; width:412px; z-index:0 } div.right { background:#0FF; height:86px; right:10px; top:10px; width:210px } </style> </head> <body> <div class="wrapper"> <div class="block"> <div class="left"> </div> <div class="center"> </div> <div class="right"> </div> </div> <!-- .block --> </div><!-- .wrapper --> </body> </html> Получается не по-центру, но приблизительно...
  15. Вот эта в IE7, в IE8 верстка не разьезжается, но фон начинает повторятся, позже могу приложить скриншот если нужно.
  16. Спасибо, хороший плагин, описанной проблемы нет, но он мне не подходит так как закруглять надо много чего, например: ссылки (a:hover), у меня не получилось закруглить. Можете посоветовать ещё какой-нибудь плагин, из опробованных: - border-radius.htc - хорошо, но не умеет закруглять отдельные углы; - СSS 3 PIE - просто идеально, никаких проблем в скруглении, но есть проблема при масштабировании в IE7 и IE8; - rocon - выше описанная проблема.
  17. Добрый вечер, сейчас верстаю один макет (в верстке недавно). Возникла проблема закругления углов, решил использовать JS (jquery.corners), но в IE6 при нечетной высоте возникает вот такая проблема: Может кто знает решение?
×
×
  • 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