Полезная информация

Общайтесь со знакомыми и друзьями в нашей группе в Контакте.

№119-05-2005 14:13:15

Salex
Участник
 
Группа: Members
Зарегистрирован: 19-04-2005
Сообщений: 42

FF & CSS. Глюк или я не догоняю?

Например:
Разметка HTML:

Выделить код

Код:

<A HREF="services.html"><SPAN CLASS=MNU1UP onMOUSEOVER="SC('MNU1DN',this)" 
onMOUSEOUT="SC('MNU1UP',this)"><IMG SRC="img/iserv.gif" CLASS=ICO> Страница 
1</SPAN></A><br>

Стили:

Выделить код

Код:

IMG.ICO {WIDTH: 16;HEIGHT: 16;float:left}
.MNU1UP {BORDER: #A00000 1PX ;CURSOR: HAND; HEIGHT: 20; PADDING: 1;  WIDTH: 100%;
 TEXT-ALIGN: CENTER;COLOR: #006600; FONT: 13,5 Arial; FONT-WEIGHT: BOLD}
.MNU1DN {BORDER: 1px solid #A00000;CURSOR: HAND;HEIGHT: 20px;WIDTH: 100%;	
TEXT-ALIGN: CENTER;COLOR: #000099;	TEXT-DECORATION: NONE;	FONT: 13,5 Arial;	
FONT-WEIGHT: BOLD;	BACKGROUND: #F5FBFF;}

Т.е. смысл такой: при наведении мыши на вышеобъявленный <span> выделяется рамочкой с подсветкой.
Результат:
В IE и Опере в рамочке весь <span> , т.е и картинка и текст ("Страница 1").
В FF Рамочка рисуется только вокруг текста ("Страница 1"). Картинка же как бы и не
приделах.

Если же в стиле картинки убрать обтекание

Выделить код

Код:

IMG.ICO {WIDTH: 16;HEIGHT: 16;}

То все работает как хотелось (и текст и картинка выделяются рамкой).
Кто тупит? Если я, то где крутнуть?

Отсутствует

 

№219-05-2005 14:38:02

Lynn
Кофеман
 
Группа: Members
Откуда: Россия
Зарегистрирован: 16-02-2005
Сообщений: 1721
Веб-сайт

Re: FF & CSS. Глюк или я не догоняю?

Кто тупит?

1. В CSS у всех размеров, кроме нулевых, надо обязательно указывать единицу измерения.
2. Приведите код в порядок.

То все работает как хотелось (и текст и картинка выделяются рамкой).

Ну так и в чём проблема?


Isn't it ironic... don't you think? — Alanis Morissette

Отсутствует

 

№319-05-2005 19:29:24

Salex
Участник
 
Группа: Members
Зарегистрирован: 19-04-2005
Сообщений: 42

Re: FF & CSS. Глюк или я не догоняю?

1. Так вроде везде где надо размеры стоят. Конкретно для рамки стоит

Выделить код

Код:

HEIGHT: 20px;WIDTH: 100%;

2. Где код не в порядке? Ткните носом.

Появляется другая проблема :) При наличии обтекания картинка в пределах <span> прижимается влево, а в оставшемся пространстве текст центрируется (TEXT-ALIGN: CENTER). Без обтекания картинка слипается с текстом и центрируется на всем пространстве <span> Получается некрасиво....

Отсутствует

 

№420-05-2005 12:15:30

Lynn
Кофеман
 
Группа: Members
Откуда: Россия
Зарегистрирован: 16-02-2005
Сообщений: 1721
Веб-сайт

Re: FF & CSS. Глюк или я не догоняю?

1.

Выделить код

Код:

WIDTH: 16;HEIGHT: 16
HEIGHT: 20; PADDING: 1;

и т.д.

2. Отформатируйте код так, что б его удобно было читать.


Isn't it ironic... don't you think? — Alanis Morissette

Отсутствует

 

№520-05-2005 12:29:50

Snik
Участник
 
Группа: Members
Зарегистрирован: 27-04-2005
Сообщений: 425
Веб-сайт

Re: FF & CSS. Глюк или я не догоняю?

Замени span на div и будет тебе щастье. Или допиши display: block. А вообще я не понял, к чему так извращаться? Не проще ли так:
a.megalink {border: none; display: block; ...}
a.megalink:hover {border: solid 1px gray; ...}
a.megalink img {float: left; ...}
<a href="services.html" class="megalink"><img src="img/iserv.gif">Страница 1</a>
Кстати, об ошибках: помимо неправильно заданной рамки для UP и недействительных значений почти всех размеров, в.т.ч. для шрифтов - вдвойне(!!!), вместо cursor: hand следует писать cursor: pointer;

2. Отформатируйте код так, что б его удобно было читать.

Присоединяюсь. Иначе трудно что-то вообще понять.

Отредактировано Snik (20-05-2005 12:33:57)

Отсутствует

 

№620-05-2005 15:03:23

Sergeys
Administrator
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 23-01-2005
Сообщений: 13900
Веб-сайт

Re: FF & CSS. Глюк или я не догоняю?

И еще, код уже давно рекомендуется писать строчными буквами иначе возможно появления ошибок в браузерах которые придерживаются стандартов.


Через сомнения приходим к истине. Цицерон

Отсутствует

 

№720-05-2005 15:07:35

Salex
Участник
 
Группа: Members
Зарегистрирован: 19-04-2005
Сообщений: 42

Re: FF & CSS. Глюк или я не догоняю?

Всем спасибо!
Отдельный респект Snik'у

to Sergeys: Над этим работаю тоже. Старый сайт. Разработка не моя.Потихоньку пытаюсь переделывать, а по большей части разбираюсь почему не работает то ли иное не в IE. Цель преобразований- приведение к стандартам и максимально идентичный вид в различных браузерах.

Отредактировано Salex (20-05-2005 15:16:42)

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]