vr201
-
Posts
22 -
Joined
-
Last visited
vr201's Achievements
Explorer (1/14)
0
Reputation
-
Иван, а почему не стоит этого делать в принципе? Дело не в том, "хочется не хочется". Бывают случаи, когда так уже есть.
-
интересует мнение. 1. когда количество строк css становится более 4000, есть ли смысл разбивать их на отдельные файлы согласно разделам? (news.css, comments.css и т.д.) 2. (возможно не в тему) когда на большом проекте стили уже разбиты на файлы согласно разделам. но имена классов совпадают. Пример .news.css -- .nav {color: red;} .comments.css -- nav {color: green;} есть ли какое-то программное решение для того, чтобы объединить стили в один файл, а имена изменить на .news_nav и .comments_nav соответственно? 3. Насколько пример из пункта 2 можно считать злом?
-
спасибо огромное. как я сам не додумался
-
CSS .chatBodyTabs { height: 46px; overflow: hidden; list-style: none; } .chatBodyTabs li { float: left; } .chatBodyTabs li a { display: block; border: 1px solid blue; padding: 0 10px; color:red; height: 25px; } HTML <ul class="chatBodyTabs"> <li> <a href="#">link 1</a> </li> <li> <a href="#">link 2</a> </li> </ul> DOCTYPE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Задача стоит следующая. Надо в ряд выставить n-ное количество блоков с шириной в зависимости от текста внутри. Пример, указанный выше, работает в FF и IE 7. В IE 6 блоки растягиваются по ширине на 100%; Если из chatBodyTabs li a убрать height, то ширина в IE 6 становится нормальной. Подскажите, пожалуйста, как выйти из ситуации? Без высоты блока - никак. Там будет фоновое изображение.
-
body { height: auto !important; height: 100%; min-height: 100%; } Как ни странно, это работает. Альтернативные браузеры правильно обрабатывают !important, поэтому из двух объявлений height срабатывает первое. IE не понимает !important, поэтому в н?м побеждает второе объявление. (Напомним, что в CSS из нескольких конфликтующих объявлений при прочих равных выигрывает то, которое ид?т последним.) Это второе объявление в IE по‑прежнему срабатывает неправильно, поэтому и получается то, что надо взято с http://webtest.chebykin.ru/articles/footer/
-
я в таких случаях использую таблицы. но самому интересно есть ли какой кроссбраузерный способ реализации подобного.
-
интересует мнение о правильной реализации нижней части страницы. а конкретно о том, что - стоИт ли прижимать футер к низу окна браузера или нет? много обсуждений и готовых решений реализации, но в есть ли такая необходимость? иногда прикрепление футера к низу окна требует дизайн макета и в этом случае вариантов для выбора мало. интересуют ваши мнения по этому вопросу. (желательно обоснованные за и против) мое мнение - нижняя часть страницы должна идти непосредственно сразу за контентной частью.
-
Что именно ужас? Код в последнем посте?
-
нашел то, что искал. тему можно закрывать. спасибо всем откликнувшимся на помощь. <!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"> <head> <meta name="description" content="description" /> <meta name="keywords" content="keywords" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title> mens </title> <style type="text/css"> * {margin: 0; padding: 0;} html, body, #all, #name {height: 100%;} #all2 { position: relative; height: 100%; min-height: 100%; } html>body #all2 {height: auto;} #footer { position: absolute; left: 0; bottom: 0; width: 100%; } #footer {background: green;} #footer, #empty {height: 50px;} /* украшательства */ body { background-color: #BBD9C1; } #content { background: yellow; } </style> </head> <body> <div id="name"><div id="all"><div id="all2"> <div id="content"> 1 <div style="height: 500px; background: red;"></div> </div> <div id="empty"> </div> <div id="footer"><span> </span></div> </div></div></div> </body> </html>
-
пока работает только первый вариант из поста ?7 но работает для одного дива. источник http://webtest.chebykin.ru/articles/footer/ как сделать, чтобы работало для двух - пока неясно. подскажите, может вообще не в ту сторону смотрю и этот метод не подходит?
-
2yopopt Да, согласен, этот код мало приспособлен. Чтобы в этом убедиться стоит всего лишь добавить в .content <div style="height: 500px;"></div> Подвал становится не внизу страницы.
-
2scrum к html нежелательно. с шириной потом не пооперируешь
-
почти, но не то. <!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"> <head> <meta name="description" content="description" /> <meta name="keywords" content="keywords" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title> mens </title> <style type="text/css"> *{margin:0; padding:0;} html{height:100%;} body{height:100%; position: relative;} #content_table{height:100%; width:100%; background: red;} #content_table td {vertical-align: top; padding-bottom: 400px;} .one{background: url(test/test1.gif) repeat-y 0 0; width:26px;} .two{background: url(test/test2.gif) repeat-y 100% 0;width:26px;} .podval { position: absolute; left: 0; bottom: 0; background: green; height: 114px; width: 100%; } </style> </head> <body> <table id="content_table" cellpadding="0" cellspacing="0"> <tr> <td class="one"></td> <td>контент</td> <td class="two"></td> </tr> </table> <div class="podval"></div> </body> </html> смотри, что с подвалом происходит.
-
для такого доктайпа, по-моему, не работает.
-
Давайте вообще отбросим футер, я его привел для наглядности. Оставим только одно - две фоновые картинки, которые вертикально повторяются на всю высоту окна браузера. Одна картинка слева, вторая справа. div.one {height 100%} div.two {height: 100%} Вот так не работает. И похоже задать высоту диву 100% при таком доктайпе (см. выше) невозможно. Для одного дива работает прекрасно следующее * {margin: 0; padding: 0;} html, body {height: 100%;} div.one { height: auto !important; height: 100%; min-height: 100%; background: url('image-fixed-width.gif') left top repeat-y; } А вот такая конструкция уже не работает * {margin: 0; padding: 0;} html, body {height: 100%} div.one { height: 100%; background: url('image1.gif') left top repeat-y; } div.two { height: auto !important; height: 100%; min-height: 100%; background: url('image2.gif') right top repeat-y; } Ищу другое решение. Может как-то на таблицах можно сделать? нет.