Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Hack do FF
Forum PHP.pl > Forum > Po stronie przeglądarki
Kas
7.02.2006, 18:39:08
Mam stronę opartą na blokach. Normalnie działa dobrze w FF. Niestety, rozjeżdza się zarówno w IE i Operze. Po zamianie dwóch wartości (szerokości bloku głównego i jego lewe marginesu) strona wygląda w nich jak trzeba. Jednak wtedy jest źle w FF. W związku z tym zastosowałem box model hacka. W FF i IE strona działa poprawnie. Problem mam dalej z Operą. W związku z tym szukam hacka do FF. Wtedy bym mógł odwrócić obecną sytuację. Istnieje coś takiego?
mike
7.02.2006, 18:51:14
Zaprezentuj kod.
Bo na FF nie ma hack'ów. Z prostej przyczyny: zarówno FF i Opera poprawnie interpretuję HTML'a

Hack'i sa tylko na badzIEwIE.
Kas
7.02.2006, 18:56:12 
[HTML] pobierz, plaintext 
  1. <div id="aukcja">
  2. <div id="opis">
  3. <div id="baner">
  4. <img src="new/header.png">
  5. <map name="menu">
  6. <area href="http://www.allegro.pl/show_user.php?search=Onekiss" shape="rect" coords="515, 18, 667, 35">
  7. <area href="http://www.allegro.pl/my_page.php?uid=2140820" shape="rect" coords="371, 18, 430, 34">
  8. <area href="http://www.allegro.pl/email_to_user.php?uid=2140820" coords="46, 18, 121, 33" shape="rect">
  9. <area href="http://www.allegro.pl/show_user_auctions.php?uid=2140820" shape="rect" coords="192, 18, 298, 36">
  10. <area href="http://www.allegro.pl/my_favourites_change.php?add_me=2140820&type=fav_sellers&option=add_user" shape="rect" coords="457, 60, 692, 72">
  11. </map><img src="new/menu.png" usemap="#menu">
  12. </div>
  13. <div id="dane">      
  14.  
  15. <div align="left"><img src="new/kontakt.png"><div class="tekst">
  16. <b>Gadu-Gadu</b><br>
  17. <a href="gg:1072848">1072848</a><br>
  18. <br>
  19. <b>Poczta</b><br>
  20. <a href="mailto:onekiss@op.pl">onekiss@op.pl</a><br>
  21. </div>
  22. </div>
  23.  
  24. <div align="left"><img src="new/konto.png"><div class="tekst">
  25. <center><a href="http://www.mbank.com.pl"><img src="http://www.onekiss.ovh.org/szablon/mbank.png"></a></center>
  26. <br>
  27. Posiadam konto w <b>mBanku</b>.
  28. Jego numer wysyłam Kupującemu zaraz po wygranej.
  29. </div>
  30. </div>
  31.  
  32. </div>
  33. <div id="content"><img src="new/opis.png"><div class="tekst">
  34. Tym razem przedmiotem sprzedaży jest profesjonalny szablon na Twoje aukcje oraz stronę "O mnie". Dzięki niemu nabiorą one profesjonlanego i eleganckiego wyglądu. W efekcie Twoje  będą bardziej zachęcały do zakupów i spwowodują zwiększenie zysków.<br><br>
  35.  
  36. <center><img src="http://www.onekiss.ovh.org/szablony/szablon_1.png"></center>
  37. <br>
  38.  
  39.  
  40. Szblon sprzedaję w imieniu autora za jego wiedzą i zgodą.<br><br>
  41.  
  42. Kupując tutaj otrzymujesz jedną kopię szablonu bez prawa do powielania lub osprzedaży.
  43.  
  44. Szablon jest zapisany w formacie PSD. Można go łatwo edytować w programie Adobe Photoshop. W razie problemów chętnie pomogę.<br><br>
  45.  
  46. Korzystanie z szablony wymaga zwenętrznego serwera. Gdyby Kupujący takiego nie posiadał otrzyma darmowe wspracie w bezpłatnym jego pozyskaniu.<br><br>
  47.  
  48. Zainteresowany zakupem szablonu przygotowanego na zamówienie wraz z gwarancją wyłączność zapraszamy na inne moje aukcje.
  49. </div>
  50. <div id="cleardiv"></div>
  51. </div>
  52. </div>
  53. <img src="new/down.png"><br><br>
  54. <font color="#ffffff">Š 2006 by Onekiss & WebTemplate</font><br>
  55. <br>
[HTML] pobierz, plaintext


Kod
body {
margin: 0;
padding: 0;
font-size: 8pt;
font-family: Verdana;
color: #000;
background-color: #4E6364;
text-align: center;
}

img {
border: 0;
}

#aukcja {
background-color: #4E6364;
float: center;
text-align: center;
}

#opis {
background-color: #FFFFFF;
}

div#aukcja {
float: center;
width: 717px;
}

a {
color: #8FBC53;
text-decoration: none;
}

a:hover {
color: #8FBC53;
text-decoration: none;
}

div#dane {
float: left;
width: 226px; //jak dam 226 px - Mozilla ok
padding-top: 0px;
padding-left: 5px;
}

* html div#dane {
width: 231px;
w\idth: 231px;
}
    
div#content {
margin-left: 241px; //jak dam 241 px - Mozilla ok
margin-right: 0px;
width: 471px;
text-align: left;
}

* html div#content {
margin-left: 234px;
m\argin-left: 234px;
}

div#baner {
margin-bottom: 10px;
}

div.tekst {
border: 1px solid #CECECE;
padding: 5px 5px 5px 5px;
margin-bottom: 10px;
}    

#cleardiv {
clear: both;
height: 10px;
}


Wiem, że nie do końca zgodny ze standardem, ale to się zmieni.

A co do tego hacka to myślałem o czymś w stylu obsługi CSS 3 poprzez "-moz-".
orson
8.02.2006, 00:19:10
witam ...

jak nie ma haków na ff questionmark.gif hak to nie jest użycie właściwości jakoś dziwnie tylko wykorzystanie błędu wparserze do styli ... tu jest dobra podstawa:
http://centricle.com/ref/css/filters/

stosowanie haków ma to do siebie że jak wyjdzie nowsza wersja przeglądarki to mogą one przestać działać ...
tip: szerokości i marginesy: ie i w3c inaczej liczą szerokość ... obrazowo: ie liczy np do zewnątrz boxa a w3c liczy do wewnętrznej krawędzi (bez bordera) więc pixel tu pixel tam i się przestaje mieścić (to tylko przykłąd bo o tym można by napisać książkę) ...

pierwsze co zrób to ustal poprawny doc type (wg tego: http://hsivonen.iki.fi/doctype/ wejście w Standards Mode rozwiązuje 90% problemów ... potem pobaw się tymi szerokościami ... haków używaj w ostateczności ...

pozdrawiam
Kas
8.02.2006, 12:46:14
Doctype nie mogę ustawić z dość prostej przyczyny: to ma być szablon na aukcje. Zaś łaskawie nam panujący serwis aukcyjny jest zgodny z

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
[HTML] pobierz, plaintext

Który mamy rok?

Cytat
tip: szerokości i marginesy: ie i w3c inaczej liczą szerokość ... obrazowo: ie liczy np do zewnątrz boxa a w3c liczy do wewnętrznej krawędzi (bez bordera) więc pixel tu pixel tam i się przestaje mieścić (to tylko przykłąd bo o tym można by napisać książkę) ...

Tak, wiem.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.