| Страниц (2): [1] 2 » |
  |
 Описание: div, а в нём 4 div по углам |
| Поиск в теме | Версия для печати |
SviMik  |
Отправлено: 19 Августа, 2006 - 09:00:43 
|
Где-то там...
Покинул форум
Сообщений всего: 3538
Дата рег-ции: Окт. 2004
Откуда: Tallinn, Estonia
Карма 4
|
Придумал вот такие вот уголки на 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">
Новости
<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>
См. скрин.
Стоит убрать или добавить одну букву, и всё ок. 
Как исправить глюк?
Прикреплено изображение (Нажмите для увеличения)
|
| |
|
| SviMik |
Отправлено: 20 Августа, 2006 - 08:14:55
|
Где-то там...
Покинул форум
Сообщений всего: 3538
Дата рег-ции: Окт. 2004
Откуда: Tallinn, Estonia
Карма 4
|
Этот баг не только в 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">
Новости
<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 раз больше твоей картинки (а про него почему-то все забывают). |
| |
|
Ray Wen  |
Отправлено: 20 Августа, 2006 - 08:19:52
|
Собиратель шишек...
Покинул форум
Сообщений всего: 2602
Дата рег-ции: Янв. 2005
Откуда: Волгоград
Карма 21
|
SviMik пишет:Больше чем ЧТО?
Больше чем CODE:<div class="button"><b>Новости</b></div> , состоящее из двух картинок...
SviMik пишет:Кнопок 20 штук и все разной ширины
с растяжкой...
SviMik пишет:А во-вторых, http-запрос будет весить в 10 раз больше твоей картинки (а про него почему-то все забывают).
Что за бред?! Этот миф походу ты сам для себя выдумал... |
| |
|
| SviMik |
Отправлено: 20 Августа, 2006 - 09:03:50
|
Где-то там...
Покинул форум
Сообщений всего: 3538
Дата рег-ции: Окт. 2004
Откуда: Tallinn, Estonia
Карма 4
|
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+++ |
| |
|
| Ray Wen |
Отправлено: 20 Августа, 2006 - 09:52:52
|
Собиратель шишек...
Покинул форум
Сообщений всего: 2602
Дата рег-ции: Янв. 2005
Откуда: Волгоград
Карма 21
|
SviMik
Хех, спорить с тобой по видимому бесполезно... упертый, а еще говорят я по зодиаку баран... 
Заголовки, это все ерунда, особенно если считать тех кто нормально настраивает свой браузер, да еще и при 10-20 кнопках на странице... А вот куча лишних тегов, это бяда, в том числе для поисковиков... Мне например частенько ставили условие чтобы вообще ни одного пустого тега небыло, так как такие сайты типо хуже обрабатываются ботами... Вообщем думай конечно сам, я лишь посоветовал не заморачиваться с подобными вещами, чем проще код, тем лучше... |
| |
|
|
| Поиск в теме | Версия для печати |
| Страниц (2): [1] 2 » |
| Сейчас эту тему просматривают: 2 (гостей: 2, зарегистрированных: 0, скрытых: 0) |
| « CSS » |
Все гости форума могут просматривать этот раздел.
Только администраторы и модераторы могут создавать новые темы в этом разделе.
Только администраторы и модераторы могут отвечать на сообщения в этом разделе.
|
|
|
Чат на форуме
Помощь
Поиск
