Strict Standards: Resource ID#33 used as offset, casting to integer (33) in /home/tvoyweb/domains/tvoyweb.ru/public_html/forums/include/fm.class.php on line 401

Strict Standards: Resource ID#35 used as offset, casting to integer (35) in /home/tvoyweb/domains/tvoyweb.ru/public_html/forums/include/fm.class.php on line 401

Strict Standards: Resource ID#36 used as offset, casting to integer (36) in /home/tvoyweb/domains/tvoyweb.ru/public_html/forums/include/fm.class.php on line 401
ТвойWeb :: Версия для печати :: 4 слоя по углам
ТвойWeb » WebMaster класс » CSS » 4 слоя по углам

Страниц (2): [1] 2 »
 

1. SviMik - 19 Августа, 2006 - 09:00:43 - перейти к сообщению
Придумал вот такие вот уголки на css. Одна трабла - иногда глючат. Вот пример.
CODE:
<div style="position:relative; float:left; height:15px;overflow:hidden; margin-left:2px; background-color:#a52222;color:white;font-family: Verdana; font-size:10px;padding-top:1px">
&nbsp;Новости&nbsp;
<div style="position:absolute;left:0px;top:0px; width:2px;height:2px;overflow: hidden; background-color:#00ff00;"></div>
<div style="position:absolute;left:0px;bottom:0px; width:2px;height:2px;overflow: hidden; background-color:#00ff00;"></div>
<div style="position:absolute;right:0px;top:0px; width:2px;height:2px;overflow: hidden; background-color:#00ff00;"></div>
<div style="position:absolute;right:0px;bottom:0px; width:2px;height:2px;overflow: hidden; background-color:#00ff00;"></div>
</div>
<div style="display:block; height:1px; overflow:hidden; clear:both; margin-top:-1px"></div>
</div>


См. скрин.

Стоит убрать или добавить одну букву, и всё ок. Не понял

Как исправить глюк?
2. Ray Wen - 20 Августа, 2006 - 01:44:23 - перейти к сообщению
SviMik
Млин, ну уголочки для кнопок таким образом, ИМХО, извращение... кода гораздо больше получится... А чтобы исправить, пиши через CSS (всмысле класс) и указывай поправку для IE, а остальных чуть ниже то что сейчас, но с html>body перед классом...
3. SviMik - 20 Августа, 2006 - 08:14:55 - перейти к сообщению
Этот баг не только в IE.
Исправил баг сам, конечная кнопка выглядит таким образом:
CODE:

<div style="position:relative; float:left; height:15px;overflow:hidden; margin-left:2px; background-color:#a52222;color:white;font-family: Verdana; font-size:10px;padding-top:1px">
&nbsp;Новости&nbsp;
<div style="position:absolute;left:0px;top:0px; width:1px;height:1px;overflow: hidden; background-color:#ffffff;"></div>
<div style="position:absolute;left:0px;bottom:0px; width:1px;height:1px;overflow: hidden; background-color:#ffffff;"></div>
<div style="position:absolute;right:-1px;top:0px; width:2px;height:1px;overflow: hidden; background-color:#ffffff;"></div>
<div style="position:absolute;right:-1px;bottom:0px; width:2px;height:1px;overflow: hidden; background-color:#ffffff;"></div>
<div style="position:absolute;right:-2px;top:0px; width:2px;height:15px;overflow: hidden; background-color:#ffffff;"></div>
</div>
<div style="display:block; height:1px; overflow:hidden; clear:both; margin-top:-1px"></div>
</div>

Ray Wen пишет:
кода гораздо больше получится...

Больше чем ЧТО? Картинкой? Кнопок 20 штук и все разной ширины. Или можешь ещё что-то предложить?
По-любому одно из условий - картинок надо как можно меньше.
А во-вторых, http-запрос будет весить в 10 раз больше твоей картинки (а про него почему-то все забывают).
4. Ray Wen - 20 Августа, 2006 - 08:19:52 - перейти к сообщению
SviMik пишет:
Больше чем ЧТО?

Больше чем
CODE:
<div class="button"><b>Новости</b></div>
, состоящее из двух картинок...
SviMik пишет:
Кнопок 20 штук и все разной ширины

с растяжкой...
SviMik пишет:
А во-вторых, http-запрос будет весить в 10 раз больше твоей картинки (а про него почему-то все забывают).

Что за бред?! Этот миф походу ты сам для себя выдумал...
5. SviMik - 20 Августа, 2006 - 09:03:50 - перейти к сообщению
Ray Wen пишет:
Больше чем Код:

Ну, во-первых, не совсем наглядно, ибо ты стили вынес отдельно. Я тоже сделаю
CODE:

<div class="button">Новости<div class="B1"></div><div class="B2"></div><div class="B3"></div><div class="B4"></div><div class="BC"></div></div><div class="CLR"></div></div>

Скажешь, что в масштабах всей страницы разница так велика?

Ray Wen пишет:
Что за бред?! Этот миф походу ты сам для себя выдумал...

Ну насчёт в 10 - да, погорячился. Но всё-таки, что больше, код выше, или запрос картинки (это только запрос, картинка ещё потом грузится будет!)?
Вот пример, что гуляет при загрузке твоей аватары, кроме самого файла:
CODE:
+++GET 20+++
Using Proxy - 207.248.240.119:80
GET http://tvoyweb.ru/forums/im/avatars/personal/398-avatar.jpg HTTP/1.0
User-Agent: Opera/7.23 (Windows NT 5.1; U) [ru]
Host: tvoyweb.ru
Accept: text/html, application/xml;q=0.9, application/xhtml+xml;q=0.9, image/png, image/jpeg, image/gif, image/x-xbitmap, */*;q=0.1
Accept-Language: ru;q=1.0,en;q=0.9
Accept-Charset: windows-1251, utf-8, utf-16, iso-8859-1;q=0.6, *;q=0.1
Accept-Encoding: deflate, gzip, x-gzip, identity, *;q=0
Accept-Encoding: deflate, gzip, x-gzip, identity, *;q=0
Cookie2: $Version=1
Connection: keep-alive

+++RESP 20+++
HTTP/1.0 200 OK
Date: Sun, 20 Aug 2006 13:01:02 GMT
Server: Apache/1.3.34 (Unix) mod_auth_passthrough/1.8 mod_log_bytes/1.2 mod_bwlimited/1.4 FrontPage/5.0.2.2635 mod_ssl/2.8.25 OpenSSL/0.9.7f PHP-CGI/0.1b
Last-Modified: Wed, 29 Jun 2005 19:41:18 GMT
ETag: "67cc5c-7dd-42c2f95e"
Accept-Ranges: bytes
Content-Length: 2013
Content-Type: image/jpeg
X-Cache: MISS from cache4.infonet.ee
X-Cache-Lookup: MISS from cache4.infonet.ee:8080
Proxy-Connection: keep-alive
+++CLOSE 20+++
6. Ray Wen - 20 Августа, 2006 - 09:52:52 - перейти к сообщению
SviMik
Хех, спорить с тобой по видимому бесполезно... упертый, а еще говорят я по зодиаку баран... Улыбка

Заголовки, это все ерунда, особенно если считать тех кто нормально настраивает свой браузер, да еще и при 10-20 кнопках на странице... А вот куча лишних тегов, это бяда, в том числе для поисковиков... Мне например частенько ставили условие чтобы вообще ни одного пустого тега небыло, так как такие сайты типо хуже обрабатываются ботами... Вообщем думай конечно сам, я лишь посоветовал не заморачиваться с подобными вещами, чем проще код, тем лучше...
7. SviMik - 20 Августа, 2006 - 16:16:36 - перейти к сообщению
Ray Wen пишет:
так как такие сайты типо хуже обрабатываются ботами...

Этот миф походу ты сам для себя выдумал... Голливудская улыбка

А мне, как я уже сказал, поставили условие: минимум картинок, лучше без них впринципе Подмигивание
Ray Wen пишет:
а еще говорят я по зодиаку баран...

Не поможет, я телец Ха-ха
8. Ray Wen - 20 Августа, 2006 - 16:57:01 - перейти к сообщению
SviMik пишет:
Этот миф походу ты сам для себя выдумал...

На самом деле не миф, и не я выдумал, я об этом написал... Это таже самая разница между обработкой меню в таблице и меню в списке, чем меньше лишних тегов, тем более пустых и внутри с нужной инфой, тем лучше...
9. SviMik - 22 Августа, 2006 - 06:05:04 - перейти к сообщению
Ray Wen
Вчера заснуть не мог, всё думал, как ты одним классом в один div вставишь 2 картинки? Ну слева ещё можно фоном с no-repeat. А на правый край? Что?
10. Ray Wen - 22 Августа, 2006 - 07:56:47 - перейти к сообщению
SviMik
А тег B тебе на что? Подмигивание

Форум на AlfaSpace.NET


Powered by ExBB
ExBB FM 1.0 RC1 by TvoyWeb.ru
InvisionExBB Style converted by Markus®

[Script Execution time: 0.0248]     [ Gzipped ]



Notice: ob_end_flush(): failed to send buffer of ob_gzhandler (1) in /home/tvoyweb/domains/tvoyweb.ru/public_html/forums/include/page_tail.php on line 33