-
ПОМОГИТЕ С CSS!
Здравствуйте!!! У меня проблема, которую никак не могу решить!
Во-первых, при листе в CSS я хочу сделать определённую картинку, которая была бы включена в ссылку при наведении мышки. Но в Опере получается, что картинка прячется куда-то и лист в виде квадратов, в ИЕ всё Ок, а в FireFox И то и другое показано(ещё хуже).
сайт здесь [Only registered and activated users can see links. Click Here To Register...] , меню слева сверху.
код :
Код:
#button {
* * *width: 100%;
* * *padding: 0px 0 0em 0;
* * *margin-bottom: 1em;
* font: bold 10pt Sans;
* color: #FFFFFF;
* * *}
#button ul {
****margin: 0;
****padding: 0;
****border: none;
* * *}
#button li {
* * *background: url(images/points.gif) no-repeat 0.9em center;
* * *border-bottom: 1px solid #96D0EF;
* /*color:*/
* * *margin: 0;
* list-style-type:square;
* * *}
#button li a {
* * *background: url(images/points.gif) no-repeat 0.9em center;
* * *display: block;
* * *padding: 0px 0px 0px 1.9em;
* * *color: #fff;
* * *text-decoration: none;
* * *width: 100%;
* * *}
html>body #button li a {
* * *width: auto;
* * *}
#button li a:hover {
* * *background: url(images/points.gif) no-repeat 0.9em center;
* * *background-color:#96D0EF;
* * *color: #fff;
* * *}
*
Во-вторых: справа под топиком дискуссии показаны последние сообщения с форума. Тоже в Листе. Во всех бровсерах всё ОК, но в Эксплорере квадратик перед каждой строкой идёт не на первой строчке сообщения, а на последней.
Код:
#fresh {
* * *width: 100%;
* * *padding: 0px 0 0em 0;
* * *margin-bottom: 1em;
* font: 8pt Arial;
* color: #FFFFFF;
* * *}
#fresh ul {
* *margin:0 2px 0 1em;
****padding: 0 2px 0 1em;
****border: none;
* * *}
#fresh li {
* * *list-style-type: square;
* * *border-bottom: 0px solid #96D0EF;
* * *margin: 0 0 1px 0;
* * *}
#fresh tt {
* * *font-family: "Times New Roman", Times, serif;
* font-size:9px;
* color:#D1EAF1;
}
#fresh li a { *
* * *color: #fff;
* * *width: 100%;
* * *}
html>body #fresh li a {
* * *width: auto;
* * *}
#fresh li a:hover {
* * *text-decoration: underline;
* * *color: #fff;
* * *}
*
Ещё одна проблема: сверху идёт переход из синего к белому, всё - картинка, а белое - просто bacground-color: #FFFFFF. У меня всё ОК, а на видео картах послабее белый фон остаётся белым, а картинка сереет и получается, что переход нарушается. Неужели мне надо вместо белого фона ставить картинку с белой заливкой, чтобы и она серела у других? Пробовал spacer 1x1 pixel , резулт - тот же.
Ещё раз здесь сайт : [Only registered and activated users can see links. Click Here To Register...]
-
Код:
#button li {
…
* list-style-type:none;
}
Это по первому вопросу, я так тебя понял?
А по второму, вот это:
Код:
[*]<a href="BB/viewtopic.php?t=6&sid=def583468b89a266a5fd2e007ab0150e" target="_blank">Соревно... (0) » На следующий же день... » Modern <TT>(10.03.-00:19)</TT>
</a>
TT — это что за тэг такой? Попробуй его чем нибудь заменить.
-
- По первому : если сделать ноне, то в Опере вообще ничего перед ссылками не будет, а в Firefoxe эта картинка "::" будет слева за пределами главной таблицы.
- По второму : Я пробовал заменить этот тег, но это никак не влияет. ТТ обычно обозначают время или другие подобные вещи, которые хочется по особому писать.
-
Код:
background: url(images/points.gif) no-repeat 0.9em center;
- здесь, я так понимаю, проблема в расстоянии для картинки от левого бордюра. Только эксплорер это понимает. Моя задача добиться того эффекта , что в Эксплорере, но на всех бровсерах, а как это сделать иначе - не знаю. Если же делать list-style-image , то в Эксплорере эта штука не будет входить в ссылку при наведении мыши, и выделятся будет не вся кнопка, а только текст.
Ещё хотелось бы узнать как можно сделать в list-style не какойт-то символ, а текстовый элемент, например, те же "::". Где-то такое читал, но не нашёл больше.
-
Ладно, с первым я справился. Просто в ХТМЛ вставил по картинке в литсе перед каждым словом.
А что же делать со вторым вопросом? У меня везде всё нормально показывает и даже в эдиторе, а в Эксплорере эта точка уходит вниз.
Прошу ответить поскорее.
-
Tiger, Лично у меня нету никакого желания ломать голову, почему у тебя что-то там неработает. У тебя на сайте 88 ошибок. Попробуй их исправить. Возможно проблема твоя отпадёт.
Если нет, тогда тебе помогут.
PS и научись называть топики нормально. Ибо будет плохо.
-
Код:
background: url(images/points.gif) no-repeat 0.9em center;
так не объявляй !
делай или относительное позиционирование (top, bottom, left, right) или точное (10px, 25em) и в том же духе, потому что некоторые броузеры чхать хотели на такое объявление.
Это во-первых
А во вторых, я не вижу никакой пробемы в размещении иконки к сылке.
1. объявляешь ссылке беграунд картинку
2. объявляешь нужный отступ padding-ом
3. ссылка работает
