Great Rash
Expert-
Posts
7,974 -
Joined
-
Last visited
-
Days Won
144
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Great Rash
-
Нет, в макете картинки нормальные. А у вас они ужасны. Какие-то артефакты по краям, неужели вы этого не видите? Ок, фотошоп заменил, но хоть размер шрифта под макет подогнать можно было? Статья нормальная, а меню вы сделали плохо Очень плохо засовывать разделители в <li>. Вот это я имел в виду: <ul class="hr"> <li>home</li> <li>|</li> <li>Products</li> <li>|</li> <li>Specials</li> <li>|</li> <li>Pro Tour</li> <li>|</li> <li>Club Hire</li> </ul> должно быть так: <ul class="hr"> <li>home</li> <li>Products</li> <li>Specials</li> <li>Pro Tour</li> <li>Club Hire</li> </ul> Все от незнания (или непонимания) блочной модели. Ширина блока складывается из, собственно, ширины и паддингов. У вас написано width: 435px; padding-left: 10px; padding-right: 30px;. В итоге получается что ширина блока равна не 435px, а 435 + 10 + 30 = 475px. А вы правой колонке продолжаете назначать отступ в 435px и она, естественно, съезжает вниз т.к. не помещается по ширине. Удивительно что не съезжает в остальных браузерах. Тут ИЕ вам совершенно верно все показал. Все оттого, что меню сверстано неправильно.
-
Как это вы так пишете? <img src="http://i030.radikal.ru/1104/de/14f2e5f220cb.jpg" width ="15%" border ="0px" vspace ="40" hspace ="230" position: fixed > Это не будет работать, потому что вы допустили как минимум 2 ошибки в этой строке.
-
Картинки ужасны Шрифты не по макету. Меню сделано совершенно неправильно (я когда-то давно так тоже делал). Но в целом рациональное зерно есть! Верстка совсем не плохая. Для первого раза очень даже неплохо. Продолжайте учиться.
-
Что-то не понятно как завязана прозрачная рамка и флоат между собой... То что вы нашли ответ - замечательно. Но я реально не понимаю что, в вашем понимании, есть обтекание одного блока другим... Вот возьмем ваш пример номер 1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title></title> <style type="text/css"> .wrap { width: 50%; margin: 0 auto; border: 1px solid; } .float { float: left; width: 150px; height: 150px; margin: 10px; background: red; } </style> </head> <body> <div class="wrap"> <div class="float"></div> <p> я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок я текст, я обтекаю плавающий блок </p> </div> </body> </html> Вот тут <p> ничего не обтекает. Обтекает только текст. Если вам надо чтобы обтекал именно блок, т.е. <p>, то надо его сделать инлайн-элементом (или, на худой конец, задать новый контекст форматирования), тогда флоат будет обтекать именно блок, а не текст как обычно.
-
sifilis, советую к прочтению. И вообще.
-
А вы в две строки попробуйте элементы расположить UPD: Да, оказался не прав, в Хроме пофиксили. Но в Сафари проблема осталась до сих пор. UPD2: И да, не с line-height, а с letter-spacing. Все зависит от аудитории сайта. Если это интернет-магазин по продаже, скажем, периферии для макбуков, то доля Safari будет стремиться к 100%.
-
Не вопрос. Писать ничего не буду, так как все уже за меня написано. Всем, кто хочет понять что такое float и как должны вести себя элементы написано тут. Читайте на здоровье и к вам обязательно придет понимание того что именно вы делаете неправильно. Вместо того чтобы меня тут на "слабо" ловить лучше б показали скрин того что вам надо...
-
Google Chrome и Safari
-
Вы реально не понимаете разницу между обтеканием текстом и обтеканием блоком! Это разные вещи. Потрудитесь объяснить по-человечески что вам надо получить. Возможно лучше всего будет если вы покажете скрин того, что вам надо получить, т.к. у вас явные проблемы с терминологией.
-
Нет не кажется, ваши скрины это подтверждают. Обтекание блоком на скринах есть только в ИЕ. Прежде чем писать советую вам самому разобраться что такое обтекание и как оно работает.
-
Таблица с тремя ячейками а в них по img - в IE проблема бордюра
Great Rash replied to artlayers's question in HTML Coding
Не верю! Ссылка на страницу есть? -
Не так все просто. Вот так кроссбраузерно: <!-- HTML --> <ul> <li>inline-block</li> <li>inline-block</li> <li>inline-block</li> <li>inline-block</li> </ul> /* CSS */ ul { list-style: none; letter-spacing: -1px; line-height: 0; font-size: 0; } li { letter-spacing: normal; line-height: normal; font-size: 12px; vertical-align: top; border: 1px solid; }
-
Обтекания не происходит не только в ИЕ6. Его нигде не происходит. Вот так все будет обтекать: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title></title> <style type="text/css"> html,body{width:100%;height:100%;padding:0px;margin:0px;} #wrapper{background:#dedede;width:100%;height:100%;} .one{margin-left:20px;width:200px;background:red;float:left;} .two{display:inline-block;width:300px;background:green;//display: inline;//zoom:1;} .three{display:inline-block;width:300px;background:yellow;//display: inline;//zoom:1;} </style> </head> <body> <div id="wrapper"> <div class="one">1</div> <div class="two">2</div> <div class="three">3</div> </div> </body> </html>
-
Есть если хотите поддерживать максимум браузеров (в том числе и старых).
-
Таблица с тремя ячейками а в них по img - в IE проблема бордюра
Great Rash replied to artlayers's question in HTML Coding
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" > Не надо так делать! Пропишите такие стили таблице: table { border: 0; border-spacing: 0; border-collapse: collapse; } И все должно заработать. -
В интернете, ваш КО
-
Я бы брал 300 рублей в час минимум.
-
При нажатии на элемент формы value очищается
Great Rash replied to shaltay's question in HTML Coding
А и правда надо бы... -
Дефолтный текст в инпуте Проблема: Необходимо сделать так чтоб по дефолту в <input> показывался некий текст, а когда элемент получает фокус нужно чтоб текст пропадал. Решение: Использовать новый атрибут тега <input> - placeholder, который был добавлен в HTML5. <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>placeholder</title> </head> <body> <form action="" method="post"> <fieldset> <input type="text" placeholder="Default value" /> </fieldset> </form> </body> </html> Это решение будет работать только в последних версиях браузеров! Кроссбраузерное решение с поддержкой старых браузеров: Если нужна поддержка старых браузеров, то наилучшим выходом будет задействовать JavaScript, используя DOM-свойство элемента <input> defaultValue. <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>placeholder</title> <script type="text/javascript"> function setClear(elem) { if (elem.value == elem.defaultValue) { elem.value = ''; } } function setDefault(elem) { if (!elem.value) { elem.value = elem.defaultValue; } } </script> </head> <body> <form action="" method="post"> <fieldset> <input type="text" value="Default value" onfocus="setClear(this);" onblur="setDefault(this);" /> </fieldset> </form> </body> </html>
-
Таблица с тремя ячейками а в них по img - в IE проблема бордюра
Great Rash replied to artlayers's question in HTML Coding
Доктайп стоит? -
#general{ margin:auto; background-color:#9CF; width:80%; border:5px solid #CCCCCC; overflow: hidden; //zoom: 1; }
-
Ну что ж так безуспешно то? Покажите что у вас получилось после того как задействовали?
-
Надо просто к изчезновению таймаут добавить, тогда чтоб начать сначала надо будет сделать очень неловкое движение
-
Постарайтесь задействовать один очень полезный девайс - мозг