brainiac

Дописал в стилях: #menu li { background-image: url(../img/r-b.png); background-position: bottom right; background-repeat: no-repeat; } Думал, может что-то перекрывает изображение… Поставил яркую 500х500 картинку — не видно её.

Добрый вечер, Гугу веб-дизайна! Вот, не знаю, как быть… В процессе создания меню для сайта столкнулся с траблом. Меню представляет собой список — <ul>. Для тега <a> прописано фоновое изображение (уголок, прибитый к левому нижнему углу). Нужен точно такой же уголок в правом нижнем. Пробовал использовать вложенный <div> — всё рушится. Подскажите, как сделать? #menu { background-color:#34618e; text-align:center; height:25px; margin-top:10px; margin-left: 50px; margin-right: 50px; padding-top: 20px; } #menu ul, #menu li { display:inline; margin:0; padding:0; } #menu a { padding:20px 25px 20px 25px; background-color:#507caa; background-image:url(../img/menu-l-b.png); background-position: bottom left; background-repeat: no-repeat; color: #f5f5f5; font-family: Helvetica, Arial, sans-serif; font-size: 20px; text-decoration:none; text-shadow: #000 1px 1px 2px; }

Для того, чтобы футер всегда был прилеплен к нижнему краю экрана, весь контент был дополнительно закинут в DIV c ID «wrap». В CSS-файле для этого DIV'a прописано следующее: #wrap { height: auto !important; min-height:100%; height: 100%; } После этих действий шрифт исказился (стал… жирнее что ли…). Вот: Если убрать в коммент #wrap, то шрифт восстанавливается, но соответственно футер наезжает на основной контент. Пожалуйста, подскажите, где копать? Я не очень хорошо знаю DIV'ную вёрстку. По инструкции всё сделал, но т.к. сайт «настоящий», 4 блоками тут не обойтись. Естественно, всё не так радужно, как на схемке: хедер, меню, контент, футер. Help me, please…

Уже во второй раз замечаю такую особенность: вставляют на сайт интерактивные Яндекс.Карты (http://api.yandex.ru/maps/) и шрифты на странице тут же становятся жирными. <!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (начало) --> <script src="http://api-maps.yandex.ru/1.1/?key=ACWYCkwBAAAAAjm-cQIA9BVr4c42irfQMwy-aTyVFtQ5VCQAAAAAAAAAAACri5-mzRv9GXNY9mlD4EIXL-79kw==&wizard=constructor" type="text/javascript"></script> <script type="text/javascript"> YMaps.jQuery(function () { var map = new YMaps.Map(YMaps.jQuery("#YMapsID-3541")[0]); map.setCenter(new YMaps.GeoPoint(37.609218,55.753559), 9, YMaps.MapType.MAP); map.addControl(new YMaps.Zoom()); map.addControl(new YMaps.ToolBar()); map.addControl(new YMaps.TypeControl()); function createObject (type, point, style, description) { var allowObjects = ["Placemark", "Polyline", "Polygon"], index = YMaps.jQuery.inArray( type, allowObjects), constructor = allowObjects[(index == -1) ? 0 : index]; description = description || ""; var object = new YMaps[constructor](point, {style: style, hasBalloon : !!description}); object.description = description; return object; } }); </script> <div id="YMapsID-3541" style="width:450px;height:350px"></div> <div style="width:450px;text-align:right;font-family:Arial"><a href="http://api.yandex.ru/maps/tools/constructor/" style="color:#1A3DC1">Создано с помощью инструментов Яндекс.Карт</a></div> <!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) --> Помогите разобраться, в чём проблема…

Есть такой блок: <div id="banner"> [место для баннера] <div style="clear:both;"></div> </div> С такими вот стилями: #banner { float:left; max-width:700px; min-width:400px; width:50% } Если вставить туда изображение и прописать для него только width=100%, то ширина блока растягивается. А как то же самое сделать для FLASH-баннера? Вот код: <object type="application/x-shockwave-flash" data="swf/banner.swf" width="100%" height="50%"> <param name="movie" value="images/header.swf" /> <param name="quality" value="high" /> <param name="menu" value="false" /> <param name="wmode" value="opaque"> <img src="images/top.jpg" alt="Без флеша" height="100%" width="50%" /> </object> При таком раскладе появляется пустое пространство сверху и снизу. Как его убрать? Пропорции FLASH — 7х4. Что прописать в WIDTH и HEIGHT, чтобы это работало правильно!? Выручите плз… дело горит просто.

Тема на удаление. Создана по ошибке. Sorry.

Поиск не работает, т.к. слово DIV видите ли слишком короткое…

Собственно, сабж. Подскажите пожалуйста, как выровнять содержимое блока DIV по центру (по вертикали)? Блок содержит только текст и ссылки. Это строка на самом деле.

Собственно, сейчас так и есть: 3 блока, а внутри каждого элементы. Вопрос в том, как для них (3х основных) прописать стили, чтобы 3 не прилипал к 1, а шёл сразу после второго. При условии, что у 1 высота фиксированная, у 2 и 3 — нет. Ширина у всех 100%.

Получить нужно вот, что: Ширина цветных блоков (про них речь) — 100% от окна браузера. Серые добавил для того, чтобы было понятно, что внутри них тоже много всего. При этом те внутренние блоки позиционируем относительно родительских.

И как же тогда быть? Убрал float из второго — эффекта нет. Если убираю position: absolute, то блоки, которые находятся внутри него растягиваются по вертикали на 100% страницы (а должны растягиваться на 100% блока). И при этом третий блок всё равно прилипает к первому.

Ну это б я догадался! А так, чтобы «красиво»…

Собственно, вся проблема описана в названии. Есть, допустим, 3 DIV'а. Для первого пишем так: width: 100%; height: 215px; position: relative; Для второго так: float: left; width: 100%; position: absolute; А в третьем, что бы я ни прописал, он прилипает к первому. Сейчас у него вообще никакого позиционирования не прописано. Скажите, как это исправить. Чтобы третий блок прилипал ко второму. При этом второй блок — резиновый.

Скажите, а как разместить 3 DIV'a по всей ширине страницы, при этом у всех них должна быть равная ширина? Можно, конечно, написать для каждого width: 33%. Но тогда останется 1%. Есть ли какой-то красивый способ?

Всем привет! Помогите пожалуйста поправить код так, чтобы он был не таким тупым (далее поймёте, почему). Нужно внутри блока #ban-about-news расположить 3 блока: #banner (занимает 50% страницы), #about (25% страницы) и #news (25% страницы). HTML-код страницы: <div id="ban-about-news"> <div id="banner"> <img src="swf/banner.png" width="100%" alt="БАННЕР"> </div> <div id="about"> <h1>ЗАГОЛОВОК БЛОКА ABOUT</h1> <p>Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.</p> <p>Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.</p> <p>Текст текст текст текст текст текст текст.</p> </div> <div id="news"> <h2>НОВОСТИ</h2> <p><div class="news-date">20.02.10</div></p> <p>Текст новости, текст новости, текст новости, текст новости, текст новости, текст новости, текст новости.</p> <p><div class="news-date">10.02.10</div></p> <p>Тест новости, текст новости, текст новости, текст новости, текст новости, текст новости.</p> </div> </div> CSS-код: #ban-about-news { border: #00F dashed; width: 100%; position: absolute; } #banner { width: 50%; max-width: 700px; min-width: 350px; float: left; } #about { position: absolute; top: 0; left: 50%; background-color: #f1f1f1; width: 25%; font-size: 90%; font-family: Arial, Helvetica, sans-serif; padding: 10px; } #about h1 { background-color: #ffffff; padding: 5px; font-family: Arial, Helvetica, sans-serif; font-size: 110%; color: #f7941e; } #news { position: absolute; top: 0; left: 77%; } #news h2 { background-color: #1255a6; color: #FFF; font-family: Arial, Helvetica, sans-serif; padding-left: 25px; } .news-date { color: #999; margin-bottom: -10px; } Кое-что из стилей выкинуто. Важно: чтобы блоки #about и #news занимали 100% высоты блока #ban-about-news. А высота последнего зависела от #about и #news. Я уже всю голову сломал. То одно наезжает, то другое выпирает… Вся надежда на этот форум.