Hobu4ek
Newbie-
Posts
8 -
Joined
-
Last visited
Hobu4ek's Achievements
Explorer (1/14)
0
Reputation
-
Здравствуйте Столкнулся с проблемой адаптивной вёрстки. Телефон имеет ширину экрана 640px, высоту 1100px Делаю в css такое условие: @media only screen and (max-device-width: 670px) { #navi-h {height:auto; width:500px; background:url(images/home-menu-bg.jpg) repeat; margin:0 auto;} } Подцепляется стиль, но отображается на экране намного меньше реальности, по ширине показывается меньше процентов на 30. В чём может быть причина? ну и дабы не быть голословным сайт f c d e c o r точка ru
-
спасибо большое я ступил проблема решена
-
Поскажите пожалуйста какую-то хитрую особенность для IE С position:fixed (актуально для всех версий) для контейнера sidebar. Свойство не работает совсем. Absolute работает, но он не подходит. При установке absolute виден ещё один хитрый баг - свойство padding для контейнера page почему то не применяется нормально и содержимое контейнера заходит под абсолютно позиционированный элемент. Сайт: http://kaprize-moda.ru/kollektsii Картинка со структурой
-
благодарю, проблема решена
-
Здравствуйте. Столкнулся с проблемой подключения PIE.htc Вот например страница: http://test.amkt.ru/chastotnyie-preobrazovateli/chastotnyie-preobrazovateli-ruselkom-vacon/ Подключаю так: <!--[if lt IE 9]> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/html5.js"></script> <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/ie.css" type="text/css" media="screen"> <![endif]--> содержимое ie.css .button, .box-1, .box-4, .box-5, .style-form, #contact-form input, #contact-form textarea, .tab_container, .button-1 {behavior: url(PIE.htc); position:relative;} ul.tabs li a {behavior: url(PIE.htc);} PIE валяется в той же папке, что и ie.css так же прилагаю стили для блоков в основном файле стилей .box-5 {background:#e9e9e9; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; box-shadow:2px 2px 3px #000, inset 0px 0px 3px #fff; padding:0px 0px 10px 0px; margin-bottom:20px;} .box-5 .list-item-head {padding:5px 10px;-moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; background:#333; color:#fff; font-size:18px; line-height:22px; font-family: 'PT Sans Caption', sans-serif; margin-bottom:10px;} .box-5 .text {padding:0 10px;}
-
Проблема решена, кому интересно, вот итоговый код с яваскриптом: <div id="wrap"> <link href="css.css" rel="stylesheet" type="text/css" /> <div id="layerbg"></div> <div id="header" align="center"></div> </div> <script language="JavaScript"> var ht=0; var sz=0; var sz2=0; ht = screen.height; sz = ht-184-60-125; sz2 = ht-184-60-125-20; document.write('<div id="main-body" style="height: '+sz+'px;">'); </script> <div> <div id="sidebar"> </div> <script language="JavaScript"> document.write('<div id="content" align="center" style="height: '+sz2+'px;">'); </script> <iframe name="cen" height="100%" width="90%" border="0" frameborder="0" marginwidth="1" marginheight="1" src="main.html"></iframe> </div> </div> <!--end of main-body--> <div id="footer"> </div> </div> <!--end of wrap--> </body> </html>
-
Благодарю за ответ. Итак, у меня что-то вроде этого должно быть по структуре: DIV1, DIV2 - оранжевые, вложенные в DIV0 DIV 1_1, DIV2_1, DIV 2_2 - зелёные, вложенные в DIV1 и DIV2 соответственно Я так понял вы говорите, что надо задать абсолютный размер для контейнера DIV2 и тогда всё получится??? Но проблема в том, что необходимо сделать так, чтобы DIV2 занимал размер от DIV1 до конца страницы. А как это сделать кроме как относительными размерами я не знаю. Точнее была идея написать ява скрипт, который брал бы значение разрешения экрана по высоте и потом вычитал из него 20, получался бы размер этого контейнера. Но как это реализовать к сожалению не знаю... заранее благодарен за помощь и поддержку
-
Здравствуйте. Делаю резиновый сайт. Не оплучается сделать нормальную высоту контейнера, работает только с фиксированным размером. Перепробовал вё что можно, не получается и всё Суть в том ещё, что сделано несоклько слоёв, на нижнем слое помещён слой с картинкой фона, который должен так же ресайзится. Может проблема в этом... В коде жирным выделил, то, что добавлял, думая, что это поможет... Код html: <div id="wrap"> <link href="css.css" rel="stylesheet" type="text/css" /> <div id="layerbg"> <img border="0" src="pict/bg.jpg" width="100%" height="100%"></td> </div> <div id="header" align="center"> <div id="topmenu" align="center"></div> </div> <div id="main-body"> <div id="sidebar"></div> <div id="content" align="center"> <iframe name="cen" height="100%" width="90%" border="0" frameborder="0" marginwidth="1" marginheight="1" src="main.html"></iframe> </div> </div> <!--end of main-body--> <div id="footer"></div> </div> <!--end of wrap--> Код CSS: #wrap {position: relative; z-index: 2; width:80%; height: 100%;} #layerbg {position: absolute; width: 100%; height: 100%; z-index: 1; left: 0px; top: 0px; border-width: 0;} #header {position: relative; z-index: 3; width: 100%; height: 184px; background-color: #FFFFFF;} #topmenu {position: relative; z-index: 4; width: 100%; height: 30px; background-color: #000000;} #footer {position: relative; z-index: 3; clear:both; height: 30px;} #main-body {position: relative; z-index: 3; float:left; width:100%; height: 100%; overflow: auto;} [b]#main-body:after {display: block; clear: both; content: ""}[/b] #content {position: relative; z-index: 3; float:right; margin-top: 20px; width: 80%; height: 100%; [b]overflow: auto;[/b] background-color: #0000FF;} #sidebar {position: relative; z-index: 3; float:left; width:20%; height: 100%; [b]overflow: auto;[/b]} Высота выставлена на 100%, а получаю вот такую фигню (синий фон контейнера сделан для наглядности того, что высота не применима к нему):