|
|
|
| Здравствуйте!
Подскажите или помогите решить проблему, как сделать эти (http://reddik.biz.ly) закладки кросбраузерными, чтобы они правильно отображались в браузерах (IE 5+, Mozilla 1.6+, Opera 7+, firefox1+).
В Mozilla и Firefox закладки разрываются посередине (http://reddik.biz.ly\1.gif), а Opera 7 появляется space справа (http://reddik.biz.ly\2.gif). Или же подскажите, может кто-то видел подобное в инете.
Закладки должны быть сделаны средствами CSS, никакой графики. | |
|
|
|
|
|
|
|
для: Andrej
(23.05.2005 в 18:24)
| | А у меня в Opere (7.23) идеально. В Mozilla, действительно, однопиксельный пробел по середине, а в IE глюки. Картинку из IE прикладываю. IE 6.0, разрешение - 1024.
PS: протестировать не могу, т.к. у вас там стили, которые во внешнем файле подключаются. | |
|
|
|
|
|
|
|
для: glsv (Дизайнер)
(24.05.2005 в 04:51)
| | Спасибо за то что ответили и пытаетесь помочь. Вот линк на стили http://reddik.biz.ly/inc/tabs.css А может Вы где-нибудь видели подобное меню с закладками на CSS? | |
|
|
|
|
|
|
|
для: Andrej
(24.05.2005 в 11:06)
| | Нельзя открыть. Лучше прикрепите файл со стилями в форум. | |
|
|
|
|
 1.5 Кб |
|
|
для: glsv (Дизайнер)
(25.05.2005 в 04:31)
| | Вот пожалуйста. | |
|
|
|
|
|
|
|
для: Andrej
(25.05.2005 в 11:02)
| | Хм... очень занимательный глюк. Первый раз такое вижу.
Проблемы в блоке
body
{
color: #000000;
background-color: #FFFFFF;
margin-bottom: 20px;
margin-right: 21px;
margin-left: 21px;
}
|
вернее в величине отступов margin. Если величина отступа нечетная (21px), то появляются 1-пиксельные пробелы в Mozille и все разъезжается в IE. Если величину отступов сделать четную, то все ОК. Например так:
body
{
color: #000000;
background-color: #FFFFFF;
margin: 22px
}
|
| |
|
|
|
|
|
|
|
для: glsv (Дизайнер)
(26.05.2005 в 04:22)
| | мдяяяя:))) я догадывался что это мелочь, но не смог ее найти. Большое спасибо!!!
и теперь буду осторожнее с непарными числами:)
а вот здесь http://www.webmascon.com/forum/viewtopic.php?p=4549#4549 "гуру" которые не смогли помочь или же просто не хотели! | |
|
|
|
|
|
|
|
для: glsv (Дизайнер)
(26.05.2005 в 04:22)
| | хмммм....поставил 22 по краях и у меня все разьезжается в IE 6:((( и в Mozilla када делаю окно 800 на 600 появляеться 1 пиксель:(( и вообще заметил такую тендеци ю када окно браузера становиться нечетным по ширине то все сезжает:(( может посоветуете как еще можно сделать такие закладки на CSS? | |
|
|
|
|
|
|
|
для: Andrej
(26.05.2005 в 14:42)
| | >када окно браузера становиться нечетным по ширине то все сезжает
Да, видимо, это проявления одного и того же глюка.
>посоветуете как еще можно сделать такие закладки на CSS?
Попробую свестать к завтру.
А вас таблицы принципиально не устраивают? Ведь они здесь очень даже к месту будут. А если только на стилях делять - никаких гарантий, что опять не слетят.
Даже наоборот - обязательно слетят при уменьшении размеров окна, если названия закладок в ширину убираться не будут. | |
|
|
|
|
|
|
|
для: glsv (Дизайнер)
(26.05.2005 в 15:11)
| | Мне нужен обязательно такой эффект как есть, чтобы при наведении мышки закладки и шрифт увеличивались, чтобы закладки были резиновыми, и линком была вся закладка а не только текст. И я старался сделать это не применяя графику и скрипты.
Большое спасибо за то, что помогаете решить проблему. | |
|
|
|
|
|
|
|
для: Andrej
(26.05.2005 в 18:59)
| | Попробуйте вот так
<html>
<head>
<title></title>
<style>
body{
color: #000000;
background-color: #FFFFFF;
margin: 22px}
table.bookmark td{text-align: center; height: 50px; }
table.bookmark td div{background-color: #B55440;}
table.bookmark td div.style2 {background-color: #804040;}
table.bookmark td a{color: #FFFFFF; display: block; height: 30px; line-height: 30px;}
table.bookmark td a:hover{height: 50px; font-size: 20px; line-height: 50px; }
</style>
</head>
<body>
<table width="100%" class="bookmark" border="0" cellpadding="0" cellspacing="0">
<tr valign="bottom">
<td width=25%><div><a href="#">page1</a></div></td>
<td width=25%><div class=style2><a href="#">page2</a></div></td>
<td width=25%><div><a href="#">page3</a></div></td>
<td width=25%><div class=style2><a href="#">page4</a></div></td>
</tr>
</table>
|
Единcтвенно, что не универсально - пришлось явно задавать ширину ячеек таблицы (width=25%). | |
|
|
|
|
|
|
|
для: glsv (Дизайнер)
(27.05.2005 в 08:39)
| | Замечательно !!! работает идеально во всех браузерах и без глюков !!!
Большое спасибо!!!!!
>Единcтвенно, что не универсально - пришлось явно задавать ширину ячеек таблицы (width=25%).
это решается таким образом
table.bookmark td {text-align: center; height: 50px; width: 25%;}
|
на таблицу это никак не повлияет так-как она у нас задана явно
<table width="100%" class="bookmark" border="0" cellpadding="0" cellspacing="0">
|
| |
|
|
|
|
|
|
|
для: Andrej
(27.05.2005 в 11:27)
| | >это решается таким образом
Я имел ввиду, что это значение зависит от числа ячеек. Будет их 5 - ширина будет уже 20%. | |
|
|
|