Altenrion
-
Posts
5 -
Joined
-
Last visited
Altenrion's Achievements
Explorer (1/14)
0
Reputation
-
Уважаемый <<WWT>> Безумно благодарен вам за оказанное содействие! Проблема решена неожиданно быстро. Обыскался в интернете вариантами и с фильтрами и с метками под IE специально... В общем вы спасли мою грешную душу от еще одной бессонной ночи))) .
-
Доброго времени суток! Проблема заключается в том, что при написании сайта необходимо было задать основному блоку фон высокого разрешения. Его размеры были заданы с помощью css3 : background-image: url(img/bg_total.png); background-repeat: no-repeat; background-size: 100% auto; -o-background-size: 100% auto; -webkit-background-size:100% auto; -moz-background-size:100% auto; -khtml-background-size:100% auto; В браузерах, в которых проверял сайт, все срабатывает как надо. Но только не в IE. Он не понимает background-size: 100% auto;. соответственно помогите найти решение данной проблемы. Возможно чтобы решение было именно для IE или просто без этого параметра. Размеры изображения известны. Заранее благодарен за любую помощь.
-
Фиксирование блока ( position: fixed или иное)
Altenrion replied to Altenrion's question in HTML Coding
left:0px; сводит блок к краю экрана, и не убирает проблему дрожания. Фиксируемый блок в свою очередь должен висеть по центру как и основной блок. -
Уважаемые товарищи! Сравнительно недавно сел за верстку проекта и столкнулся с новой для себя проблемой. Надеюсь на действенные советы и помощь. Суть задачи: Верстка страницы сайта в 3 колонки div-ами, располагающимися внутри основного. Также в основном блоке имеется горизонтальный <div>, который требуется зафиксироватиь внизу экрана, чтобы при скролле страницы ( в случае появления скролла) он оставался всегда на своем месте. В верстке основных блоков проблем не возникло, а вот при реализации фиксированного блока появились трудности. Для реализации этой задачи я использовал position: fixed; bottom: 0px; Блок зафиксировался на нужном месте, но в Google Chrome прокрутка страницы очень сильно подвисает ( подергивается), в Mozilla FF все читается отлично. Ниже привожу код: <!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="stylesheet" type="text/css" href="menu.css" /> <meta http-equiv="content-type" content="text/html; charset=windows-1251" /> </head> <body> <div id="total"> <div id="top"> <div id="top_left"> fdsgs dfgsdfg sdfg sf df gsfgsdf gfsdg dfs gsdfg sdf gsdfg s sdfg sdf gsdf g </div> <div id ="top_right"> fdsgs dfgsdfg sdfg sf df gsfgsdf gfsdg dfs gsdfg sdf gsdfg s sdfg sdf gsdf g </div> </div> <div id="center"> <div id="left"> <ul id="menu"> <li><a href="/" target="_self">Главная</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> </ul> </div> <div id="center1"> fdsgs dfgsdfg sdfg sf df gsfgsdf gfsdg dfs gsdfg sdf gsdfg s sdfg sdf gsdf g </div> </div> <div id="right"> <ul id="menu2"> <li><a href="/" target="_self">Главная</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> <li><a href="#" target="_self">Ссылка</a></li> </ul> </div> <div id="fixed-div"> fdsgs dfgsdfg sdfg sf df gsfgsdf gfsdg dfs gsdfg sdf gsdfg s sdfg sdf gsdf g </div> </div> </body> </html> И css код соответственно: * { margin: 0; padding: 0; } html { height: 100%; } header, nav, section, article, aside, footer { display: block; } body { font: 12px/18px Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%; background: url('/n.gif') no-repeat; background-attachment: fixed; } a { color: blue; outline: none; text-decoration: underline; } a:hover { text-decoration: none; } p { margin: 0 0 18px } img { border: none; } #total { width: 960px; height: 100%; position: relative; border: 1px solid black; margin: 0 auto ; /* background-color: #ffd700 ; */ background-image: url(img/bg_total.png); background-size: 100% auto; background-repeat: no-repeat; /* z-index: 2; */ } #menu{ z-index: 4; } #top{ Width: 960px; height: 100px; margin: 0 auto; border: 1px solid #3eff51; } #top_left{ Width: 150px; height: 100px; float: left; border: 1px solid #3eff51; } #top_right{ Width: 800px; height: 100px; float:right; border: 1px solid #b7ff3a; } #center { border: 1px solid black; width: 750px; height: 100%; float: left; margin: 0 auto; } #right { border: 1px solid black; width: 180px; height: 100%; float: right; } #left { border: 1px solid black; width: 150px; height: 100%; float: left; /* padding-left: 40px; */ } #center1 { border: 1px solid black; width: 590px; height: 100%; float: right; padding-left: 0px; } #fixed-div { width: 960px; height: 259px; border: 1px solid red; position: fixed; bottom: 0px; background-image: url(img/bg_bottom.png); background-size: 100% auto; background-repeat: no-repeat; z-index: -1; } Собственно при проверке в остальных браузерах столкнулся с вечным IE который не корректно отображает фон всей страницы. Если кто может подсказать альтернативный вариант кода для IE буду премного благодарен. В течении 2 суток нашел очень много информации по возможным вариантам фиксирования блоков и с css и js, jquery , но в них не силен поэтому прошу совета, или ссылку на ресурс где я смог бы разобраться.