Dasha

Подскажите, пожалуйста, что делаю не так? Верстка на css Мне нужно, чтобы две разные флешки показывались на одной странице В опере проблем нет вообще, показываются, а вот в IE первая флешка показывается, а вторая нет как ни крутилась, ничего не вышло. флешки не пересекатся css —-- #sloy1{ position:absolute; margin-top:10px; margin-left:10px; width:50px; height:50px; z-index:1; } #sloy2{ position:absolute; margin-top:100px; margin-left:100px; width:50px; height:50px; z-index:2; } страница —————-- <div id="sloy1"> тут код флешки с добавленным <param name="wmode" value=opaque> </div> <div id="sloy2"> тут код флешки с добавленным <param name="wmode" value=opaque> </div>

Проблема все таки вылезла. И очень неприятная. Если мы создаем блок sloy1,sloy2 и еще один такой же блок sloy3,sloy4 У обоих блоков ширина 900 пиксюлей. Если они располагаются друг над другом, то настройки верхнего блока убивают настройки нижнего блока. Например, для нижнего блока мы устанавливаем #block2 a{} #block2 a:hover{} и вот эти ссылки уже не будут работать, они даже не будут нажиматься или выделяться как-то, т.к. их блокирует верхний слой. Z-index'ом можно поменять слои местами, но от этого не слаще. Все будет с точностью до наоборот - ссылки слоя, который внизу, блокируются, а того, который вверху работаю. Причем IE8 нормально переваривает наложение, работаю и те и те ссылки. А вот Опера ссылки нижнего слоя убивает. Подскажите, как быть. Может можно какое-то свойство прописать слою, чтобы он ни при каком раскладе не трогал другие слои, с которыми он соприкасается? Если нельзя, то тогда вопрос в первом моем посте остается открытым

Поняла, СПАСИБО, уже кинулась применять. Довопросец: если в указанном вами примере окошко браузера сузить, то налево слой с красным фоном не уедет, но между границей браузера и красным фоном слева остается неубираемые 5 пиксюлей пустоты. Как бы из убрать?

Спасибо, то что нужно.

По идее при таком раскладе можно и амедия не прописывать, поставив эти двум дивам по-умолчанию display:none; в ксске Верно?

Про такой вариант я думала уже, но он не подходит, т.к. нужно именно абсолютное позиционирование и возможность этот слой поставить в любое место страницы, не раскурочив ее содержимое. Вопрос в силе.

Есть один слой. Я его выравниваю по центру окна. Но вот незадача, когда я окно браузера сужаю наполовину, к примеру, то у меня половина моего слоя равномерно благополучно заезжает за левый край браузера и становится недоступной. Как сделать так, чтобы при соприкосновении с левой стороной окна браузера, слой оставался на странице, т.е. переставал ехать налево? Т.е. чтобы центрирование работало, только когда ширина окна браузера больше ширины слоя, т.е. 900 пикселей. #sloy{ top: 50px; width: 900px; height:50px; background:red; position: absolute; left: 50%; margin-left: -450px; }

Извиняюсь за свою невнимательность, добавила изменения, которые вы привели, заработало. Catherine, спасибо за рабочий вариант. Только вот еще небольшой вопросец - в нижний слой (#down) я вставила картинку, также, как и в верхний (#up). Верхний слой прижался плотно к правому верхнему углу, а НИЖНИЙ к правому углу плотно прижался, а к нижнему с отступом пикселей в 5 на глаз. Как бы это исправить, чтобы #down к низу плотно прижался?

Спасибо, похоже, что и меня выручило. Вдогонку, дабы быть точно уверенной, что вопрос для меня закрыт, доспрошу. Если мне нужно несколько условий прописать в JS для разных экранов, то правильно ли я думаю, что заработает вот что: <script language="JavaScript1.2"> if (screen.availWidth <= '1250') { document.write('<STYLE>#panelka1 {display:none;}#panelka2 {display:none;}</STYLE>'); } else if (screen.availWidth >= '1251' && screen.availWidth <= '1350') { document.write('<STYLE>#panelka1 {display:true;}#panelka2 {display:none;}</STYLE>'); } else if (screen.availWidth >= '1351') { document.write('<STYLE>#panelka1 {display:none;}#panelka2 {display:true;}</STYLE>'); } </script> Верно?

Спасибо за ссылочку. КАКИЕ-ТО ЧУДЕСА творятся. по вашей ссылке, которую я открываю в IE как раз, а он у меня 8 версии, все показывается именно так, как нужно, справа вверху и справа внизу. Создаю свой .html файл, запускаю его в IE8 и опять 25, фон красный вверху растянут на всю ширину экрана, и картинки опять прижались к левому боку и не отлепляются оттуда (( практически хнык текст хтмлки моей <html> <head><title></title> <style> #up, #down { background: red; position:fixed; } #up{ top:0; right:0; } #down{ bottom:0; right:0; } </style> <body> <div id='up'><img src="https://r.bstatic.com/static/img/b25logo/booking_header.png"></div> <div id='down'>down</div> <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tempus tempus lectus, eu commodo lorem tempor id. Vestibulum at sapien tortor. Pellentesque non odio erat, nec imperdiet risus. Aliquam fermentum bibendum libero vel tempus. Pellentesque vehicula dui ut magna placerat vehicula. In consectetur magna et neque eleifend faucibus a sed ante. Proin laoreet mattis purus pellentesque adipiscing. Donec sed justo eget massa fringilla fermentum. Ut eu metus varius ante sollicitudin pharetra id ut ligula. Pellentesque vehicula enim ut nunc porttitor sed pulvinar felis hendrerit. Aenean faucibus vehicula nunc eu bibendum. Quisque sit amet convallis dolor. Nam massa est, hendrerit eu viverra eu, vulputate id magna. Nunc arcu magna, posuere lobortis tempus at, consequat non neque. Duis scelerisque, dolor eu placerat vestibulum, neque turpis luctus tellus, eu vulputate leo orci viverra mi. Aenean fermentum, dui sed pellentesque dignissim, libero urna euismod lectus, mattis tincidunt neque tortor a mi. Nunc mauris enim, accumsan vitae dapibus sit amet, adipiscing quis eros. Sed quis turpis et risus fringilla convallis quis sed tortor. Sed eu ligula sed elit egestas ullamcorper. Phasellus aliquet lorem in justo tincidunt ut sodales sem lacinia. Quisque at massa neque. Pellentesque nec magna erat, id adipiscing libero. Duis quam risus, scelerisque in porta at, rutrum in ipsum. Proin urna risus, eleifend eu dignissim vitae, tempor rhoncus magna. Quisque posuere venenatis diam, nec accumsan dolor euismod vitae. Suspendisse vel tortor sem. Fusce pulvinar rutrum eros, sed viverra velit commodo pulvinar. Proin quis quam quis orci cursus luctus eget quis ipsum. Nam aliquet semper metus vel placerat. Quisque a odio quis ligula egestas iaculis sit amet vel ante. Mauris et dolor velit, non sollicitudin magna. Proin imperdiet tincidunt quam, sed vehicula felis porta eget. In non urna vitae nisi vulputate sodales. Suspendisse potenti. Curabitur gravida, augue quis vestibulum mattis, sem erat aliquet lacus, non lobortis nulla elit et nisl. Suspendisse at nisl odio. Nam fermentum egestas quam, non accumsan orci tempus nec. Pellentesque sed sem nibh, vitae auctor orci. Etiam eu laoreet elit. Cras eros nisl, blandit bibendum posuere id, fringilla ac tortor. Curabitur et libero eget sem ultrices mattis. In a mauris libero, eget ultrices dolor. Vestibulum ornare cursus urna, vel fermentum odio cursus quis. Suspendisse potenti. Etiam eleifend mauris sed diam dapibus luctus. Fusce consectetur, est eget placerat faucibus, enim velit tempus leo, vitae laoreet arcu dui vitae nulla. Donec nulla sem, porttitor fringilla blandit in, accumsan quis enim. Curabitur posuere aliquam porta. Quisque rutrum, purus nec suscipit commodo, ipsum est elementum dui, sit amet varius odio leo dapibus sem. Sed placerat euismod mi id fermentum. Vivamus hendrerit tincidunt felis, sed convallis leo semper nec. Curabitur quis lorem mauris. Vestibulum accumsan rutrum mauris, non fermentum augue mattis vel. Pellentesque et elit enim, sed placerat nulla. Mauris lorem tortor, aliquam at posuere nec, semper vel urna. Cras tortor tortor, lacinia vitae accumsan a, tincidunt at mi. Vivamus vel justo augue. Proin non blandit tellus. In hac habitasse platea dictumst.</div> </body> </html> Я не понимаю, как одно и тоже может по-разному отображаться у меня на компьютере и со стороннего сайта. В чем ошибочка, не подскажите?

Еще пара часов потеряно, рецепт так и найден. Есть две маленькие картинки. одну нужно расположить справа вверху страницы. Вторую- справа внизу страницы. И все это должно оставаться на месте в при прокрутке станицы. Я написала вот что: #up{ position:fixed; top:0%; right:0%; } #down{ position:fixed; bottom:0%; right:0%; } В опере работает, а в IE не желает. В IE все это хозяйство прилипло к левому верхнему углу и упорно не хочет оттуда выходить. Подскажите, пожалуйста, как сделать так, чтобы и в IE работало.

Так на этом выводе я последнее предложение поста своего и закончила Искала, но никак не могу допереть, как это сделать фактически на моем примере. Может кто-то все таки знает?

ситуация следующая ——————————————————— Есть панелька, прописанная в основной css'ке в виде слоя. Нужно сделать так, чтобы она отображалась только тогда, когда разрешение монитора у посетителя выше 1280 по ширине. Т.е., к примеру при разрешении экрана 1024 на 768 она отображаться не должна. ВАЖНО - работать это должно ВО ВСЕХ основных браузерах. Я прописала такое в ксске: @media (max-width: 1250px) and (min-width: 300px) { #panelka { display:none; } } #panelka{ top: 50px; width: 100px; height:100px; position: absolute; left: 10px; } сам html файл при этом содержит <div id="panelka">панелька</div> в результате ОПЕРА при разрешении выше 1250 показывает панельку, при разрешении ниже - нет. Отлично. А с инернет эксплорером не получается. IE у меня 8 версии он показывает эту панельку при любом разрешении экрана, и, судя по тому, что я начиталась, версии до 9той не поддерживают @media, т.е. нужно что-то как-то хаками прописать. Я в них пыталась разобраться, но у меня не получилось. Помогите, пожалуйста. Подправьте мой кодик, если не трудно, чтобы IE версий до 8ой включительно не показывал панельку, если разрешение экрана ниже указанных 1250 пикселей по ширине.

Доброй всем ночки. Сразу прошу прощения за вопрос. Но до ответа на него я что-то не могу никак дойти. Проблема вот в чем. Есть два слоя. Нужно сделать так, чтобы один был над другим. При этом нужно сделать так, чтобы один слой был ровно над другим, куда бы мы этот див в body документа не вставили. То есть их содержимое друг с другом не должно быть связано никак. Чтобы, к примеру, какой-то скрипт, вставленный в один слой, не трогал вообще никак другой, не смещал его никуда. Вариант с тем, чтобы у одного слоя поставить left: 200px; top: 20px; а у другого left: 200px; top: -40px; к примеру не подходит. Визуально один слой на другой наложится, но такие дивы в body не переставить местами уже. Динамическое содержание верхнего слоя в этом случае также будет двигать нижний слой. Подскажите, что я не так сделала, мой код ниже. Не судите строго, я только учусь. <style> div#base { position: absolute; margin-left: 49%; z-index: 5; } div#layer1 { font-size: 50px; color: #000080; position: relative; left: 200px; top: 20px; z-index: 2; } div#layer2 { color: #ffa500; /* orange */ font-size:70px; position: relative; left: 200px; top: 20px; z-index: 1; } </style> </head> <body> <div id="layer1">Слой 1</div> <div id="layer2">Слой 2</div> </body> </html>