ils
-
Posts
61 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by ils
-
"все что серое и градиентное" это большая картинка. Что-вроде: .header { background: url(все_что_серое_и_градиентное.png); } А такие тени и градиенты вы с помощью CSS не сделаете.
-
А что вам мешает? 1. div с фоном (все что серое и градиентное) 2. Лого слева 3. Телефон и меню справа При чем тут таблицы
-
Полностью поддерживаю. Используйте по возможности спрайты и все будет ок.
-
Уровень сжатия зависит от целей, которые вы планируете достич с помощью этого сайта. Для промо сайтов какого-либо товара, сайта-визитки, портфолио и т.д. главное качество. Для сайта с высокой посещаемостю, ориентированного на предоставление контента всем и каждому - размер. Imho.
-
.clr { clear:both; overflow: hidden; } Надеюсь понятно?
-
Как я понимаю у вас там куча графики которую проблематично позиционировать используя используя float, margin, padding и т.д. Поэтому, как я уже говорил, можно сделать что-то вроде: <div class="header"> Пихаем сюда все что нужно для шапки. </div> .header { position: relative; } .все элементы внутри шапки { positon: absolute; } И позиционируем их используя width, height, left, right, top, bottom. А лучше скрин покажите. Разберемся как-нибудь.
-
Если шапка действительно сложная я бы использовал position:absolute (но это imho).
-
Ну если так хочется, то пожалуйста. А чем вам DIVы не угодили?
-
Chrome, Firefox, Opera - Работает. IE не проверял, но, насколько мне помниться, должно работать начиная 7-ой версии.
-
Неужели так сложно сделать полоску меню на всю ширину экрана?
ils replied to yanch258's question in HTML Coding
Упс. Тогда прошу извинить. Попробуйте решить свою проблему так. Сейчас у вас: ... <div id="wrap"> ... <div id="header"> <ul id="menu-new_menu" class="nav sf-js-enabled sf-shadow">...</ul> </div> ... </div> ... #wrap { Какие-то стили } Должно быть: ... <div class="wrap"> ... </div> <div id="header"> <ul id="menu-new_menu" class="nav sf-js-enabled sf-shadow wrap">...</ul> </div> <div class="wrap"> ... </div> ... .wrap { Какие-то стили } #header { width: 100%; } -
Неужели так сложно сделать полоску меню на всю ширину экрана?
ils replied to yanch258's question in HTML Coding
А вы зайдите на сайт ТСа в раздел с ценами и сами узнаете. -
Неужели так сложно сделать полоску меню на всю ширину экрана?
ils replied to yanch258's question in HTML Coding
Да пошли вы со своим гелем для душа за 28 тыс.руб. Очередной развод. -
Уберите все .clr и попробуйте .orderby-displaynumber {overflow: hidden;} PS: В опере ваш пример работает.
-
http://jsfiddle.net/ils_user/yyRu4/1/
-
И что это означает?
-
Дык этож data-атрибуты. Обычно используются в скриптах.
-
В вашем случае нормально.
-
Держи. Сегодня я добрый. <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>My First Page</title> <style> * { margin:0; padding:0; } body { font-family: arial; font-size: 14px; } .wrapper { margin: 0 auto; width: 960px; } .header { background: #D8D8BF; color: #333333; padding: 30px 0; } .header h1 { font-size: 40px; } .header span { color: #A92608; } .header p { color: #999999; } .menu { margin: 1px 0 20px 0; background-image: -o-linear-gradient(top, #E7E6D8, #D9D9C0); background-image: -ms-linear-gradient(top, #E7E6D8, #D9D9C0); background-image: -webkit-linear-gradient(top, #E7E6D8, #D9D9C0); background-image: -moz-linear-gradient(top, #E7E6D8, #D9D9C0); background-image: linear-gradient(to bottom, #E7E6D8, #D9D9C0); overflow: hidden; } .menu ul { list-style-type: none; } .menu li { float: left; margin: 5px 10px 5px 0; } .menu a { color: #000000; text-decoration: none; } .content { float: left; width: 760px; } .content h2 { color: #A92608; font-size: 18px; } .about { font-size: 12px; } .content p { margin: 10px 0; } .sidebar { margin-left: 760px; } .sidebar h3 { background: #E8E8E8; border-radius: 5px; font-weight: normal; padding: 4px; } .sidebar ul { list-style-position: inside; margin-bottom: 10px; } .sidebar li { border-bottom: solid 1px #cccccc; padding: 4px; } .sidebar a { color: #A92608; text-decoration: none; } .footer { background: #e6e6e6; padding: 10px 0; clear: both; text-align: center; color: #676767 } </style> </head> <body> <div class="header"> <div class="wrapper"> <h1>Заголовок <span>сайта<span></h1> <p>Описание</p> </div> </div> <div class="menu"> <ul class="wrapper"> <li><a href="">Один</a></li> <li><a href="">Два</a></li> <li><a href="">Три</a></li> <li><a href="">Четыре</a></li> </ul> </div> <div class="wrapper"> <div class="content"> <h2>Название статьи</h2> <div class="about">Бла-Бла-Бла</div> <p>Бла-Бла-Бла</p> <p>Бла-Бла-Бла</p> <p>Бла-Бла-Бла</p> </div> <div class="sidebar"> <h3>Заголовок 1</h3> <ul> <li><a href="">Один</a></li> <li><a href="">Два</a></li> <li><a href="">Три</a></li> <li><a href="">Четыре</a></li> </ul> <h3>Заголовок 2</h3> <ul> <li><a href="">Один</a></li> <li><a href="">Два</a></li> <li><a href="">Три</a></li> <li><a href="">Четыре</a></li> </ul> </div> </div> <div class="footer"> Copyright </div> </body> </html> Специально для ТС:
-
Вместо display:inline; пишите float:left;
-
Напишите в CSS: #top2 {background: url(http://visam.ru/img/pass.jpg) 100% 0 no-repeat}
-
Ага не таблицами. А это что: <table cellpadding="0" cellspacing="0" border="0" width="1000" align="center" class="start"> <tr class="top-bg"> <td height="160" align="right">
-
Ответы на ваши вопросы - Тынц
-
Поподробнее
-
Макет. Все работает (точно работает). <!doctype html> <html> <head> <title>Page</title> <style> * { margin: 0; padding: 0; } .os { background: green; width: 900px; margin: 0 auto; padding: 60px 10px 10px 10px; } .vl { background: blue; padding: 10px; } .right { background: yellow; width: 200px; float: right; } .left { background: maroon; margin-right: 200px; } .clearfix { clear: both; } </style> </head> <body> <div class="os"> <div class="vl"> <div class="right"> <div>Фото</div> <div>Какая-то штука с полосками</div> <div>Тест правой колонки</div> </div> <div class="left"> Много-много-много текста </div> <div class="clearfix"></div> </div> </div> </body> </html>
-
...бла-бла-бла... <img src="default.jpeg" id="image"> ...бла-бла-бла... <script> window.onload = function(){document.getElementById('image').onmousedown = function(){return false}} </script>
