-
Posts
2,118 -
Joined
-
Last visited
-
Days Won
11
Content Type
Profiles
Forums
Calendar
Store
Everything posted by mishka
-
Вы что ничего незнаете про наследование стилей? если вы зададите размер шрифта на body 10px, то и во всех ul и p, и div... будет размер шрифта 10px. (Заголовки это другая история). А также почитайте про line-height И в вашем случае лучше задавать размер шрифта и высоту строки на ul Добавьте ul.test_ul{ font-size:10px; line-height:10px; } ну а с ссылки и с li уберите размер шрифта
-
В ие6-7 по умолчанию есть эта полоса прокрутки, так уж они устроенны. Я дал код который убирает ее. Вот дальше сам...
-
Недолжны. Если только они не флотнутые или блочные.
-
А это как повезет . Если psywalker берется за решение вопроса то обычно подтягиваются и другие , а это значит что решение почти наверняка будет найдено
-
Не подскажешь чем так лучше?
-
<!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> <title>test60</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> <!-- html,body{ margin:0; overflow:hidden; height:100%; } #wrapper{ height:100%; width:100%; overflow:auto; } #content{ width:800px; margin:0 auto; overflow:hidden; } --> </style> </head> <body> <div id="wrapper"> <div id="content"> <p>Lorem ipsum dolor sit amet consectetuer massa Suspendisse at consequat condimentum. Congue Pellentesque id molestie tortor tortor vitae dolor quis id.</p> <p>Congue auctor justo quis sit ut sem lacus et nonummy eu. Eros ac urna metus vitae massa.</p> <p>Magna feugiat lacinia condimentum feugiat et Nulla non condimentum ut nulla. Vitae Phasellus faucibus montes sem neque.</p> <p>Nibh justo adipiscing eros id natoque gravida est est nibh Quisque. Lorem Ut.</p> <p>Convallis urna ut Vestibulum Praesent turpis nibh semper interdum iaculis Sed. Convallis augue et tortor Quisque sagittis dolor at adipiscing faucibus turpis. Ut quis Duis augue.</p> </div> </div> </body> </html>
-
Хватит меня хвалить. Реально кто проанализирует полностью всю тему, тот скажет(и будет прав на все 100%) что это ты сделал основную часть работы. Процентов так на 95!!! А моя заслуга маленькая. Я ток в конце подправил чуток!
-
Для #wrapper релейтив нужен чтобы оверфлов хидден работал, для того чтобы внутренние блоки которые имеют релейтив не вылезли. Если его убрать то появится горизонтальная полоса прокрутки от блока .right. В ие так точно появится
-
непонял вопрос. На самом деле будет здорово если сделать чтобы центральная часть растягивала по высоте боковые части
-
Вот конечный результат, с учетом правильной последовательности блоков <!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>Block</title> <style type="text/css"> body{ margin:0; min-width:800px; _width:expression(document.documentElement.clientWidth < 800 ? "800px" : "auto"); } #wrapper{ width:100%; overflow:hidden; position:relative; } .wrap{ width:800px; margin:0 auto; position:relative; background:#00f; } .left, .right{ width:200px; background:#f00; position:absolute; left:-200px; top:0; } .right{ right:-200px; left:auto; } .center{ overflow:hidden; _zoom:1; } </style> </head> <body> <div id="wrapper"> <div class="wrap"> <div class="center"> <p>Lorem ipsum dolor sit amet consectetuer Curabitur laoreet Aenean tellus et. Nunc justo ut consequat et Cum amet Maecenas laoreet Nulla felis. </p> <p>In Curabitur id condimentum id Integer dictumst ipsum nunc dictum eget. Nulla et magnis justo justo tincidunt gravida justo Curabitur turpis sagittis. Pellentesque.</p> <p>At eu quis ipsum elit Sed pede nec vestibulum morbi Cum. Et fringilla rhoncus pretium id enim lobortis lacus ut leo nunc. Vivamus Donec elit nunc scelerisque.</p> </div> <div class="left"> <p>Lorem ipsum dolor sit amet consectetuer tempus nibh dolor interdum.</p> </div> <div class="right"> <p>Lorem ipsum dolor sit amet consectetuer magna mauris justo auctor pede. Laoreet Cum lacinia wisi Aliquam nibh id.</p> </div> </div> </div> </body> </html>
-
Да я то что... Всю работу сделал ты я ток чуток подправил ненадо! так как ширина есть 100% а для .center - можна
-
<!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>Block</title> <style type="text/css"> body{ margin:0; min-width:800px; _width:expression(document.documentElement.clientWidth < 800 ? "800px" : "auto"); } #wrapper{ width:100%; overflow:hidden; position:relative; } .wrap{ width:800px; margin:0 auto; position:relative; background:#00f; } .left, .right{ width:200px; background:#f00; position:absolute; left:-200px; top:0; } .right{ right:-200px; left:auto; } .center{ overflow:hidden; } </style> </head> <body> <div id="wrapper"> <div class="wrap"> <div class="left"> <p>Lorem ipsum dolor sit amet consectetuer tempus nibh dolor interdum.</p> </div> <div class="right"> <p>Lorem ipsum dolor sit amet consectetuer magna mauris justo auctor pede. Laoreet Cum lacinia wisi Aliquam nibh id.</p> </div> <div class="center"> <p>Lorem ipsum dolor sit amet consectetuer Curabitur laoreet Aenean tellus et. Nunc justo ut consequat et Cum amet Maecenas laoreet Nulla felis. </p> <p>In Curabitur id condimentum id Integer dictumst ipsum nunc dictum eget. Nulla et magnis justo justo tincidunt gravida justo Curabitur turpis sagittis. Pellentesque.</p> <p>At eu quis ipsum elit Sed pede nec vestibulum morbi Cum. Et fringilla rhoncus pretium id enim lobortis lacus ut leo nunc. Vivamus Donec elit nunc scelerisque.</p> </div> </div> </div> </body> </html> Еще раз повторюсь - я делаю не на 1000, а меньше так как мне так удобнее тестить
-
Непонял, так резиновые бока иль всеже фиксированные? Как тема называется?
-
Ачем ненравится тот вариант который Great Rash уже предложил? Это немного переделанная работа от Great Rash <!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" xml:lang="en" lang="en"> <head> <title>Title</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <style type="text/css"> body{ margin:0; min-width:800px; _width:expression(document.documentElement.clientWidth < 800 ? "800px" : "auto"); } .left, .right{ float:left; width:50%; height:100px; background:#f00; margin:0 -50% 0 0; overflow:hidden; } .right{ float:right; margin:0 0 0 -50%; } .left-inner{ margin:0 400px 0 0; } .right-inner{ margin:0 0 0 400px; } .center{ width:800px; overflow:hidden; position:relative; margin:0 auto; background:#ff0; } </style> </head> <body> <div class="left"> <div class="left-inner">left box</div> </div> <div class="right"> <div class="right-inner">right box</div> </div> <div class="center"> <p>Lorem ipsum dolor sit amet consectetuer malesuada pretium Maecenas Nunc elit. Quisque Morbi malesuada quis mi Phasellus vestibulum magna Mauris penatibus molestie. Suspendisse vel.</p> <p>Vivamus mollis lacinia ut Vivamus convallis nunc Nam Vestibulum vel ante. Elit nisl et quam enim a neque ante at neque netus. Porttitor.</p> <p>Lorem lobortis augue eros senectus id penatibus quis Phasellus semper ornare. Scelerisque nibh et consectetuer nec natoque Aliquam.</p> </div> </body> </html>
-
как вам такой вариант? Только есть минус - правый и левый блок не растягивается по высоте в зависимости от высоты центрального. Делал ширину 800 так как у меня моник 17" и мне плохо тестить на 1000 <!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" xml:lang="en" lang="en"> <head> <title>Title</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <style type="text/css"> body{ margin:0; min-width:800px; } .left, .right{ float:left; width:50%; height:100px; background:#f00; margin:0 -50% 0 0; } .right{ float:right; margin:0 0 0 -50%; } .center{ width:800px; overflow:hidden; position:relative; margin:0 auto; background:#ff0; } </style> </head> <body> <div class="left"></div> <div class="right"></div> <div class="center"> <p>Lorem ipsum dolor sit amet consectetuer malesuada pretium Maecenas Nunc elit. Quisque Morbi malesuada quis mi Phasellus vestibulum magna Mauris penatibus molestie. Suspendisse vel.</p> <p>Vivamus mollis lacinia ut Vivamus convallis nunc Nam Vestibulum vel ante. Elit nisl et quam enim a neque ante at neque netus. Porttitor.</p> <p>Lorem lobortis augue eros senectus id penatibus quis Phasellus semper ornare. Scelerisque nibh et consectetuer nec natoque Aliquam.</p> </div> </body> </html>
-
Теперь сделай окно браузера узким и посмотри что с синим блоком творится
-
Переделайте меню нормально. Чтобы валидно было. Если вы его просто скопипастили откудато, и непонимаете как его правильно сделать, то попробуйте разобратся. Главное поверьте что это совсем несложно сделать кросбраузерное валидное выпадающее меню. По поводу того что у вас нет строки 98. В браузерах (фф, опера, хром...) - заходите на сайт, ждете пока он загрузится, нажимаете ctrl+u, и смотрите исходный html-код. Еще и после этого скажете что у вас нет строки 98? Ето хостинг добавляет. За бесплатное приходится платить. Но про это надо было сразу предупредить, тогда не возникло бы таких непоняток. Оценка порезки - 3 за старания. Сейчас вы с этим будете спорить. Но через время, когда наберетесь опыта, все сами поймете. Дизайн - простой. В северных краях может лося и считают благородным животным, но на вашей картинке он выглядит просто лосем. Его бы както получше сделать.
-
Валидатор выдает все ошибки которые есть! Это вы нехотите признать что не совсем понимаете как правильно надо делать! Проверьте еще раз внимательнее хотябы данный пример который я цитировал, может всеже увидите что тут банально неправильно закрыты теги как раз таки на 52 линии ... А если по другому неработает - так это не говорит что вы все правильно сделали, а не совсем компетентные люди из W3 и разработчики браузеров неправильно сделали браузер, рекомендации и валидатор.
-
Да я же тебе рабочий пример дал, который через классы работает. И дает высоту блокам с одинаковым классом по самому высокому из них. А в этом случае: document.getElementById("r_box").style.height = document.getElementById("box").offsetHeight; во-первых работает через айдишник. во-вторых если содержимое r_box будет выше чем box, то всеравно блоку r_box присвоется высота блока box и содержимое в блоке r_box обрежется, или же некрасиво вылезет. держи еще раз, если что не так - то говори. <!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> <title>sameHeight</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> <!-- body{ margin:0; font:16px/18px Verdana,Tahoma,sans-serif; } .holder{ width:100%; overflow:hidden; margin:10px 0 0; } .sidebar{ float:left; width:200px; padding:0 10px; background:#ccc; _margin:0 -3px 0 0; } .content{ overflow:hidden; padding:0 10px; background:#eee; _zoom:1; } p{ margin:10px 0; } --> </style> <script type="text/javascript"> <!-- function initScript(){ startSameHeight(); window.onresize=function(){startSameHeight()}; } function startSameHeight(){ sameHeight({ tagName:'div', tagClass:'block' }); sameHeight({ tagName:'div', tagClass:'block2' }); } function sameHeight(_options){ var _tagName=_options.tagName; var _tagClass=_options.tagClass; var maxHeight=0; var _elements=document.getElementsByTagName(_tagName) var re=eval('/'+_tagClass+'\\'+'b/'); if(_elements){ for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height='auto'; if(_elements[i].offsetHeight>=maxHeight){ maxHeight=_elements[i].offsetHeight; } } } for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height=maxHeight+'px'; } } } } if(window.addEventListener){ window.addEventListener("load",initScript,false); }else if(window.attachEvent){ window.attachEvent("onload",initScript); } //--> </script> </head> <body> <div class="holder"> <div class="sidebar block"> <p>sidebar</p> </div> <div class="content block"> <p>Lorem ipsum dolor sit amet consectetuer nulla vel tincidunt urna semper. Vestibulum turpis tincidunt gravida eros vel Phasellus nunc sodales tempor dictumst. Nec nec id.</p> <p>Ridiculus est Maecenas Phasellus est In sed augue Suspendisse ante ac. Nulla volutpat Vestibulum Vestibulum odio id ullamcorper non dignissim tellus justo. Ut sed.</p> </div> </div> <div class="holder"> <div class="sidebar block2"> <p>sidebar</p> </div> <div class="content block2"> <p>Lorem ipsum dolor sit amet consectetuer Curabitur at sagittis felis lacinia. </p> <p>Nibh tellus semper In semper sapien rutrum mus est dolor aliquet. Tellus vitae nibh faucibus augue Curabitur vestibulum amet elit.</p> <p>Sed non tellus Nunc Morbi tempus Curabitur tempus dui nibh a. Pellentesque Nullam semper vitae volutpat ut adipiscing lobortis.</p> <p>Ridiculus est Maecenas Phasellus est In sed augue Suspendisse ante ac. Nulla volutpat Vestibulum Vestibulum odio id ullamcorper non dignissim tellus justo. Ut sed.</p> </div> </div> </body> </html>
-
посмотри пример, может подойдет <!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> <title>sameHeight</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> <!-- body{ margin:0; } .box{ float:left; width:30%; padding:0 10px; } .element{ float:left; padding:0 10px; } .holder{ width:100%; overflow:hidden; } --> </style> <script type="text/javascript"> <!-- function initScript(){ startSameHeight(); window.onresize=function(){startSameHeight()}; } function startSameHeight(){ sameHeight({ tagName:'div', tagClass:'box' }); sameHeight({ tagName:'span', tagClass:'element' }); } function sameHeight(_options){ var _tagName=_options.tagName; var _tagClass=_options.tagClass; var maxHeight=0; var _elements=document.getElementsByTagName(_tagName) var re=eval('/'+_tagClass+'\\'+'b/'); if(_elements){ for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height='auto'; if(_elements[i].offsetHeight>=maxHeight){ maxHeight=_elements[i].offsetHeight; } } } for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height=maxHeight+'px'; } } } } if(window.addEventListener){ window.addEventListener("load",initScript,false); }else if(window.attachEvent){ window.attachEvent("onload",initScript); } //--> </script> </head> <body> <div class="holder"> <div class="box" style="background:#c33"> <p>Lorem ipsum dolor sit amet consectetuer sem tempus tortor hac nunc. Orci Sed dolor parturient In eget parturient sit Nullam ante elit. Non nec Nam tincidunt augue.</p> </div> <div class="box" style="background:#33c"> <p>Lorem ipsum dolor sit amet consectetuer nulla vel tincidunt urna semper. Vestibulum turpis tincidunt gravida eros vel Phasellus nunc sodales tempor dictumst. Nec nec id.</p> <p>Ridiculus est Maecenas Phasellus est In sed augue Suspendisse ante ac. Nulla volutpat Vestibulum Vestibulum odio id ullamcorper non dignissim tellus justo. Ut sed.</p> </div> <div class="box" style="background:#3c3"> <p>Lorem ipsum dolor sit amet consectetuer et Vestibulum ac nibh eu. Phasellus.</p> <p>Tincidunt Curabitur Vestibulum semper enim Cras ut laoreet Nulla mattis Integer. Magna laoreet eu libero pellentesque morbi ut euismod at neque sed. Leo vel tellus et.</p> </div> </div> <div class="holder"> <span class="element" style="background:#e31ed7"> span </span> <span class="element" style="background:#0c8eff"> span<br /><br />span </span> </div> </body> </html>
-
Мдя, сразу смеялся, потом стало грустно, скоро буду плакать.
-
Great Rash, спасибо ты настоящий джедай . Действительно ошибка была у меня, так как у меня два раза идет проверка, а я менял только первую. Все супер. Спасибо тебе <!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> <title>sameHeight</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> <!-- .box, .block{ float:left; width:300px; padding:0 10px; } .element{ float:left; padding:0 10px; } --> </style> <script type="text/javascript"> <!-- function initScript(){ sameHeight({ tagName:'div', tagClass:'box' }); sameHeight({ tagName:'div', tagClass:'block' }); sameHeight({ tagName:'span', tagClass:'element' }); } function sameHeight(_options){ var _tagName=_options.tagName; var _tagClass=_options.tagClass; var maxHeight=0; var _elements=document.getElementsByTagName(_tagName) var re=eval('/'+_tagClass+'\\'+'b/'); if(_elements){ for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height='auto'; if(_elements[i].offsetHeight>=maxHeight){ maxHeight=_elements[i].offsetHeight; } } } for(var i=0;i<_elements.length;i++){ if(re.test(_elements[i].className)){ _elements[i].style.height=maxHeight+'px'; } } } } if(window.addEventListener){ window.addEventListener("load",initScript,false); }else if(window.attachEvent){ window.attachEvent("onload",initScript); } //--> </script> </head> <body> <!-- wrapper --> <div id="wrapper"> <div class="boxes" style="background:#ff0;height:1%;overflow:hidden;padding:0 10px"> <p>t</p> </div> <div class="box" style="background:#c33"> <p>Lorem ipsum dolor sit amet consectetuer sem tempus tortor hac nunc. Orci Sed dolor parturient In eget parturient sit Nullam ante elit. Non nec Nam tincidunt augue.</p> </div> <div class="box" style="background:#33c"> <p>Lorem ipsum dolor sit amet consectetuer nulla vel tincidunt urna semper. Vestibulum turpis tincidunt gravida eros vel Phasellus nunc sodales tempor dictumst. Nec nec id.</p> <p>Ridiculus est Maecenas Phasellus est In sed augue Suspendisse ante ac. Nulla volutpat Vestibulum Vestibulum odio id ullamcorper non dignissim tellus justo. Ut sed.</p> </div> <div class="box" style="background:#3c3"> <p>Lorem ipsum dolor sit amet consectetuer et Vestibulum ac nibh eu. Phasellus.</p> <p>Tincidunt Curabitur Vestibulum semper enim Cras ut laoreet Nulla mattis Integer. Magna laoreet eu libero pellentesque morbi ut euismod at neque sed. Leo vel tellus et.</p> </div> <div class="block" style="background:#33AF6B"> <p>Lorem ipsum dolor sit amet consectetuer nulla vel tincidunt urna semper. Vestibulum turpis tincidunt gravida eros vel Phasellus nunc sodales tempor dictumst. Nec nec id.</p> <p>Ridiculus est Maecenas Phasellus est In sed augue Suspendisse ante ac. Nulla volutpat Vestibulum Vestibulum odio id ullamcorper non dignissim tellus justo. Ut sed.</p> <p>Maecenas est ipsum rutrum Sed elit dictumst tristique volutpat In nisl. Natoque felis Cum et parturient amet iaculis In quis lacus quis. </p> <p>Curabitur Curabitur orci wisi ut lorem urna feugiat pretium vitae consectetuer. Hendrerit Nullam eget odio in risus in.</p> </div> <div class="block" style="background:#E3A133"> <p>Lorem ipsum dolor sit amet consectetuer et Vestibulum ac nibh eu. Phasellus.</p> <p>Tincidunt Curabitur Vestibulum semper enim Cras ut laoreet Nulla mattis Integer. Magna laoreet eu libero pellentesque morbi ut euismod at neque sed. Leo vel tellus et.</p> <p>Eu id lacus eu Vestibulum egestas vitae enim id mauris ut. Sagittis lorem Curabitur tincidunt semper justo nunc auctor orci gravida adipiscing. Pulvinar sem nunc et semper dapibus.</p> </div> <span class="element" style="background:#E31ED7"> span </span> <span class="element" style="background:#0C8EFF"> span<br /><br />span </span> </div> <!-- end wrapper --> </body> </html>
-
Во как работать надо! А вы тут развели флейм по поводу стоит ли верстать с учетом ие6. Тут человек говорит Валидатор в попу. Это вам не мыло по тазику ганять
-
несработало результат тот же
-
Ну спрайт пнг для ссылок Естественно не рейтинги ие6 http://dimox.name/dinamic_link_buttons_with_css/