» Вопросы по CSS

GeMir
Можно ещё так:
Код: div {white-space: nowrap}

evoroz
Ну типа того только, тогда всё выравнивается по низу, а нужно что бы только один самый нижний блок...Вот смотри


Код: <td width="198" rowspan="2" valign="top" background="images/mainbg_1.gif"><img src="images/date_1.gif" alt="" width="117" height="12" class="textpic" />
<div class="news">Вітаємо учнів та їх батьків з початком нового навчального року!</div>
<div class="moren"><a href="#">більше</a></div>
<img src="images/date_2.gif" alt="" width="117" height="12" class="textpic" />
<div class="news">У гімназії відбудеться концерт до Дня Вчителя.</div>
<div class="moren"><a href="#">більше</a></div>
<img src="images/date_4.gif" alt="" width="116" height="13" class="textpic" />
<div class="news">Дискотека присвячена до початку осінніх канікул та свята Helloween</div>
<div class="moren"><a href="#">більше</a></div>
<img src="images/date_3.gif" alt="" width="142" height="13" class="textpic" />
<div class="news">В будинку чителя відбудеться святкування 70 річчя Гімназії</div>
<div class="moren"><a href="#">більше</a></div>
<div style=" margin-top:14px"><a href="#"><img src="images/ban_elpr.gif" alt="Web-page on English about UNESCO and Gymnasium Oriental Languages 1" border="0"/></a></div></td>

Salik
А может перед ним просто распорку поставить:
img src="images/1х1.gif" alt="" width="1" height="100%"
Картинка - прозрачный gif 1х1.

evoroz
Неа не работает Вот посмотри www.kgol1.com баннер справа внизу Unesco and Gymnasium вот его нужно прилепить, посмотришь код через "показать искодники" что б я здесь не постил... там наверно могут влиять как параметры размеров главной таблицы, так и таблицы в которую загнан баннер. По крайней мере на тот способ что ты предложил, оно в Dreamweaver ужасно растягивает вниз, в експлорере 7 при этом выглядит как надо, но если растянуть центральную часть то зависает гдн-то посередине, а лисица и опера вообще никак не реагируют на распорку

Да там на странице сейчас всё ещё через марджинг

Ребята подскажите как реализовать данный вопрос:
        

Код:
<div id="">
<div style="float: left;">
<a href="#" id="">
пикча
</a>
</div>

<div style="тут как написать?">
<a href="#" id="">
пикча
</a>
</div>

<div style="float: right;">
<a href="#" id="">
пикча
</a>
</div>

</div>

Sky hawk
Про float'ы здесь хорошо написанно...

GeMir

Цитата:

Про float'ы здесь хорошо написанно...

ага полезный материал.
пс. поделил на процентах
спасибо

Есть ли возможность переключать CSS-файлы посредством ссылок без PHP?..

GeMir
Выбор CSS для разных браузеров.

Cheery
Дело в том, что нужно не для разных.
На странице две ссылки - клик по первой, подключает 1.css, клик по второй - 2.css.

GeMir

Цитата:

Есть ли возможность переключать CSS-файлы посредством ссылок без PHP?..

По идее через JavaScript должно реализовываться.

GeMir
Alternative Style: Working With Alternate Style Sheets

А вообще, это за легко гуглом находится.

GeMir

Цитата:

На странице две ссылки - клик по первой, подключает 1.css, клик по второй - 2.css.

какая разница для разных или нет? я тебе пример простейший привел.
ставишь куку, потом перегружаешь страницу и в зависимости от куки цепляешь другой css файл.

ну а для продвинутых можно цеплять к title.. динамически (ссылка в пред. теме). но, скорее всего, не будет работать во всех браузерах (я так цепляю для клавы js, не пашет в safari, к примеру)

Cheery
evoroz
ELV1S
Спасибо.

Ещё один вопрос. Есть следующий код:

Код: ul {
    padding: 5px 100px 5px 130px;
    margin: 0 0;
    list-style-image: url(bullet.jpg);
    list-style-position: outside;
}
li {
    padding: 5px 5px 5px 5px;
    margin: 0 0;
    font-family: arial;
    font-size: 80%;
    color: #FFFFFF;
}

GeMir

Цитата:

list-style-image: url(bullet.jpg);

А каковы размеры картинки?

Проблема вот в чем: есть меню, у которой закладки меняют свое расположение относительно центральной линии в зависимости от активности. Т.е. если закладка активна, то она показывается сверху, все остальные снизу, ни и т.д. В IE все отображается отлично, однако в Opera все меню уезжает вверх на логотип
Как можно исправить?



Код:
#header
{
    margin: 0;
    padding: 0;
    width: 800px;
    height: 120px;
    background: #4e959b url('../images/top02.jpg') no-repeat top center;
}

#menu
{

    float: none;
    margin: 92 0 0 0px;
    padding: 0 0 0 130px;
    height: 56px;
    display: block;
    font-size: 10px;
}

#menu li
{
    display: block;
    text-align: center;
    float: left;
    list-style: none;
}

#menu li a
{
    background-image: url('../images/menu_top.jpg');
    color: #000;
    text-decoration: none;
    font-weight: 700;
    display: block;
    width: 90px;
    height: 23px;
    background-position: 0 23px;
    border: 0px none; margin-left: 2px; margin-right: 2px; margin-top:28px; margin-bottom:0; padding-left:0; padding-right:0; padding-top:5px; padding-bottom:0
}

#menu li.active a, #menu li.active a:hover
{
    color: #000;
    margin: 5px 0 21px 0px;
    padding: 6px 0 0 0;
    padding-top: 5px;
    height: 23px;
    background-position: 0 0;
}

#menu li a:hover
{
    background-position: 0 49px;
}

evoroz

Цитата:

А каковы размеры картинки?

5x5 пикселов.

GeMir

Цитата:

5x5 пикселов

Может сделать ее 12х5? И гиф.
12 - высота строки. Если что, и размер шрифта 12px.

evoroz

Цитата:

12 - высота строки. Если что, и размер шрифта 12px.

По-моему, не выход: cтоит измениться высоте строки (размеру шрифта)
и понадобится новая картинка.

GeMir

Цитата:

cтоит измениться высоте строки (размеру шрифта)
и понадобится новая картинка

Я поэтому и предлагаю фиксировать размер шрифта.

evoroz
А мне не нужен фиксированный размер шрифта

Извините, почему не могу создать новую тему? ( не нашел кнопку, есть возможность только ответить в темах )

Teze
Ты еще не достиг 10 сообщений!

evoroz
С моей проблемой помочь не можешь?

Gemir, а почему делаешь с image? Там можно и без image обойтись, зачем грузить всякими картинками то, что делается легко?


Mistake, спасибо.



Добавлено:

GeMir , если ОЧЕНЬ нужно именно с твоей картинкой - попробуй сделать общий background для ul = никаких проблем в броузерах не будет )



Добавлено:
Вот пример, работает на всех броузерах четко:


<style type="text/css">
<!--
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0;
font-size: 80%;
font-weight: bold;
background: #FFF;
}

h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}

ul {
list-style: none;
margin: 0;
padding: 0;
}

img {
border: none;
}


/*- Menu 2--------------------------- */

#menu2 {
width: 200px;
margin: 10px;
border-style: solid solid none solid;
border-color: #D8D5D1;
border-size: 1px;
border-width: 1px;
}

#menu2 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}

#menu2 li a:link, #menu2 li a:visited {
color: #3688BA;
display: block;
background: url(menu2.gif);
padding: 8px 0 0 32px;
}

#menu2 li a:hover, #menu2 li #current { {
color: #3688BA;
padding: 8px 0 0 32px;
}
-->
</style>
</head>

<body>
<h2>Привет Gemiru</h2>
<div id="menu2">
<ul>
<!-- CSS Tabs -->
<li><a id="current" href="1.html">Элемент списка 1</a></li>
<li><a href="2.html">Элемент списка 2</a></li>
<li><a href="3.html">Элемент списка 3</a></li>
<li><a href="4.html">Элемент списка 4</a></li>
<li><a href="5.html">Элемент списка 5</a></li>
<li><a href="6.html">Элемент списка 6</a></li>
<li><a href="7.html">6ой элемент</a></li>

</ul>
</div>

Добавлено:

menu2.gif - готовый есть, только не знаю как на форум загрузить ) но делается легко: width сделай в ширину меню, сделай транспарент, и круг ставь где хочешь )

Teze

Цитата:

почему делаешь с image?

Потому что.

Цитата:

Там можно и без image обойтись

Но мне нужно именно с image.

Цитата:

попробуй сделать общий background для ul

Ты это о чём?..

GeMir, см. выше примерный код, там с background. Вместо того, чтоб готовые файлы копировать, надо и самому немного думать, ведь и до меня подсказали как можно сделать.

Teze
Мне не подходят варианты, предложенные evoroz - это раз.
Мне не нужно меню, меню нужно Mistake2 - это два.
В твоём коде интересным для меня многло бы быть это:

Код: ul {
list-style: none;
margin: 0;
padding: 0;
}

Mistake2

Цитата:

С моей проблемой помочь не можешь?

Я просто не понимаю, что у тебя происходит. Дай ссылку на страницу или часть кода страницы.

GeMir , а ты сам вобще думать отказываешься, ждешь пока форумчане тебе готовый код выставят? Тут никто не будет тебе миллион вариантов предлагать, пока тебе не понравиться хоть какой. Достаточно советов и примеров - на том примере все для менюшки, но раз уж ты прекрасно понимаешь какой вариант тебя устраивает, то можешь из примерного кода сделать оптимальный вариант, так же воспользоваться советом, что выше.

Пусть чайники читают FAQ по CSS прежде чем сайты делать, а гуру - им достаточно и совета и примерного кода )

Добавлено:

Еще один вариант: http://www.webmascon.com - меню слева как раз правильно составлен. Вот тебе и пример.

Если еще и после этого будешь выступать, оставлю тебе линк на FAQ для чайников

Добавлено:
Ну там слева меню вобще нет, я имед ввиду менюшку справа )))



CHERRY , ok, только что заметил. Будем знать.

Подскажите как сформировать такие списки

1.
1.1
1.2
1.3
1.3.1
1.3.2
1.3.3
1.4
2.
3.
....


Вот так вроде работает


Цитата:

<style>
OL { counter-reset: item }
LI { display: block }
LI:before { content: counters(item, "."); counter-increment: item }

но только в Opera, а в IE6 1.1. заменяется на 1, а 1.2. на 2, т.е. отсутствует родительская цифра. Почему?