Jump to content

serzh

Newbie
  • Posts

    6
  • Joined

  • Last visited

Everything posted by serzh

  1. Наш?л несколько решений для создания аналога min-width под IE 6. Для наступающих на те же грабли, в дополнение к предыдущему посту привожу ещ? один вариант: <?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" /> <title> min-width in Internet Explorer - fixed </title> <style type="text/css"> body {background:#fff; font-family:"trebuchet ms", "times new roman", times, serif; font-size:76%;} .css {color:#983; font-family:"times new roman", serif;} .play {font-family:"trebuchet ms", tahoma, arial, verdana, sans-serif; margin:0; color:#000; font-weight:normal;} /* for all browsers that understand min-width */ .container {position:relative; width:90%; min-width:400px;} .holder {display:block; color:#000;} /* method 1 a bodge for IE5.5 and IE6 browsers */ * html .container {border-right:400px solid #fff;} * html .holder {display:inline-block; position:relative; margin-right:-400px;} /* for all browsers that understand min-width */ .container2 {position:relative; width:90%; min-width:400px;} .holder2 {display:block; color:#000;} /* method 2 a bodge for IE browsers IE5.01, IE5.5 and IE6 */ * html .container2 {border-right:400px solid #fff;} * html .holder2 {float:left; position:relative; margin-right:-400px;} /* General styling */ h1 { font-size: 5.3em; letter-spacing: -3px; color:#06a; font-weight:normal; margin:0; font-family:"times new roman", times, serif; } h2 { font-size: 2em; color:#f60; font-weight:normal; margin-top:0; padding:top:1em; } .b1 {height:1px; font-size:1px; overflow:hidden; display:block; background:#aaa; margin:0 5px;} .b2 {height:1px; font-size:1px; overflow:hidden; display:block; background:#fff; border-right:2px solid #aaa; border-left:2px solid #aaa; margin:0 3px;} .b3 {height:1px; font-size:1px; overflow:hidden; display:block; background:#fff; border-right:1px solid #aaa; border-left:1px solid #aaa; margin:0 2px;} .b4 {height:2px; font-size:1px; overflow:hidden; display:block; background:#fff; border-right:1px solid #aaa; border-left:1px solid #aaa; margin:0 1px;} .content {border-right:1px solid #aaa; border-left:1px solid #aaa;} h1, h2, h3, h4, p {margin-left:5px; margin-right:5px;} p {margin-bottom:0; padding-bottom:1em;} .rule {width:400px; background:#c00; color:#fff; margin:1em 0;} </style> </head> <body> <h1 style="position:relative; z-index:100;"><b class="css">CSS</b><span class="play">play</span></h1> <h2>experiments with Cascading Style Sheets</h2> <h3 class="norm">by Stu Nicholls</h3> <h1>method 1</h1> <div class="container"> <div class="holder"> <b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b> <div class="content"> <h2>{width:90%; min-width:400px;} includes IE5.5 and IE6</h2> <h3>this is the first of two ways that I have found to emulate true min-width in IE and uses an inline-block, a border-width and a negative margin (NO javascript).</h3> <h4>this div has a min-width of 400px and a width of 90%. You can set the width as any percentage and the min-width as a px or em value.</h4> <p>discovered 11th May 2005 by Stu Nicholls</p> </div> <b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b> </div> </div> <div class="rule"><p>this div is 400px wide and can be used as a guide for min-width.</p></div> <h1>method 2</h1> <div class="container2"> <div class="holder2"> <b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b> <div class="content"> <h2>{width:90%; min-width:400px;} includes IE5.01, IE5.5 and IE6</h2> <h3>this is the second way that I have found to emulate true min-width in IE and uses float left, a border-width and a negative margin (NO javascript).</h3> <h4>this div also has a min-width of 400px and a width of 90%. You can set the width as any percentage and the min-width as a px or em value.</h4> <p>discovered 11th May 2005 by Stu Nicholls</p> </div> <b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b> </div> </div> <p>compliant <a href="http://validator.w3.org/check/referer" title="Valid XHTML 1.1!">xhtml 1.1</a></p> <p><a href="http://www.cssplay.co.uk/comments/comments.php?comment_id=IE min width" title="please leave your comments here ">leave your comments here</a></p> <p><a href="../index.html" title="home">home</a></p> </body> </html> Всем спасибо за участие в обсуждении.
  2. 2 ЗАВАРКА Как не игрался - не помогает. Я в трауре...
  3. Извините, но я не понял вашего вопроса. Что такое "+ экспрешн для ie6"?
  4. Эээ..., поторопился. Надо было применить указанные свойства к диву, который объединяет обе колонки Для оперы и лисы добился положительного результата, а вот для IE6 - дизайн просто стал фиксированной ширины (улетучилась "резиновость" ) Здесь зв?здочнка - не опечатка?
  5. Нет, это не помогает ни в одном браузере.
  6. Здравствуйте. Обращаюсь с вот такой проблемой, для которой никак не могу подобрать решение. Есть "резиновая" страница, состоящая из двух колонок на базе div: правая фиксированной ширины для меню навигации, а левая - с основным текстом, горизонтальные размеры которой подстраиваются под размеры окна браузера. Под текстом находится форма обратной связи. Можно ли как-то ограничить горизонтальные размеры левой колонки оредел?нной величиной, скажем, 300px? Пока никакого решения (без использования таблиц) не наш?л. Просто если совсем сузить окно браузера, элементы формы залезают на меню навигации, а мне этого не нужно.
×
×
  • 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