Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS]szablon allegro
Forum PHP.pl > Forum > Przedszkole
Marcek190891
7.11.2009, 23:28:05
Witam, pisze tutaj gdyz na innym forum nie dali sobie rady z moim problemem. Zakodowałem sobie szablon allegro z wykorzystaniem css i problem dotyczy nachodzenia białego paska z galerii wzdłuż szablonu. Dzieje sie tak tylko w firefoxie dodając do aukcji więcej niż 1 zdjęcie przez system dodawania zdjec allegro. Oto kod i linki.

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
  2. <head>
  3. <style type="text/css">
  4. <!--
  5. body { margin: 0 auto; font: 10pt Arial,Tahoma; color: white; padding:0; background-color: #161515; width: 100%; }
  6. #margin { border: 0px solid; margin: 0px auto; width: 900px; }
  7. #left { width: 217px; float: left; }
  8. #kategorie2 {  background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/kategorie2.jpg'); width: 217px; min-height: 40px; float: left; }
  9. #kategorie22 {margin-left: 10px; margin-right: 10px; padding-top: 15px; color: #ffffff; font-family: Times New Roman; font-size: 14px; float: left; } 
  10. #strona { width: 683px; float: left; }
  11. #belka {  background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/belka.jpg'); width: 683px; height: 31px; float: left; }
  12. #belka_tresc { padding: 5px; margin-left: 50px; }
  13. #tresc { background-color: #161515; width: 683px; min-height: 600px; float: left;}
  14. #tresc2 { padding: 20px; text-align: center; margin-left: 10px; margin-right: 10px;}
  15. #kategoriee {  margin-left: 10px; margin-right: 10px; padding-top: 15px; }
  16. #kategoriee a {color: #ffffff; text-decoration: none;}
  17. #kategoriee a:hover {color: red; text-decoration: none;}
  18. #konto { font-size: 11px; }
  19. #poziome { float: left; margin: 0px; }
  20. #inne { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/01.jpg'); width: 128px; height: 49px; float: left; font-family: Tahoma; color: #ffffff; font-weight: bold; font-size: 18px; }
  21. #komentarze { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/1.jpg'); width: 131px; height: 49px; float: left; font-family: Tahoma; color: #ffffff; font-weight: bold; font-size: 18px; }
  22. #omnie { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/2.jpg'); width: 89px; height: 49px; float: left; font-family: Tahoma; color: #ffffff; font-weight: bold; font-size: 18px; }
  23. #napisz { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/3.jpg'); width: 147px; height: 49px; float: left; font-family: Tahoma; color: #ffffff; font-weight: bold; font-size: 18px; }
  24. #dodaj { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/4.jpg'); width: 214px; height: 49px; float: left; font-family: Tahoma; color: #ffffff; font-weight: bold; font-size: 18px; }
  25. #reszta { background-image:url('http://www.dociepleniowiec.cal.pl/nettyper/img/5.jpg'); width: 191px; height: 49px; float: left; font-family: Tahoma; color: #FF8A00; font-weight: bold; font-size: 21px; }
  26. #reszta_tresc {  margin-left: 60px; margin-top: 9px;}
  27. #reszta_tresc a {color: #FF8A00; text-decoration: none;}
  28. #reszta_tresc a:hover {color: #FFAD4D; text-decoration: none;}
  29. #tresc_beam { margin-left: 7px; margin-top: 12px; text-decoration: none; color: white;}
  30. #tresc_beam a {color: #ffffff; text-decoration: none;}
  31. #tresc_beam a:hover {color: #D1D1D1; text-decoration: none;}
  32. -->
  33.  
  34. </style>
  35. </head>
  36. <center>
  37. <body xml:lang="pl">
  38. <div id="margin">
  39.  
  40. <div id="poziome">
  41.     <div id="inne"><div id="tresc_beam"><a href="http://allegro.pl/show_user_auctions.php?uid=10834709">Inne Aukcje</a></div></div>
  42.     <div id="komentarze"><div id="tresc_beam"><a href="http://allegro.pl/show_user.php?uid=10834709&type=fb_all">Komentarze</a></div></div>
  43.     <div id="omnie"><div id="tresc_beam"><a href="http://allegro.pl/my_page.php?uid=10834709">O mnie</a></div></div>
  44.     <div id="napisz"><div id="tresc_beam"><a href="http://allegro.pl/email_to_user.php?uid=10834709">Napisz e-mail</a></div></div>
  45.     <div id="dodaj"><div id="tresc_beam"><a href="http://allegro.pl/my_favourites_edit.php?type=fav_sellers&fav_id=10834709&ret=%2Fshow_user.php%3Fuid%3D10834709%26type%3Dfb_all">Dodaj do ulubionych</a></div></div>
  46.     <div id="reszta"><div id="reszta_tresc"><a href="http://www.nettyper.eu">Sklep</a></div></div>
  47. </div>
  48.  
  49. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/logo.jpg" width=900px height=201px>
  50. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/pasek.jpg" width=900px height=20px>
  51.  
  52. <div id="left">
  53. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/kategorie.jpg" width=217px height=46px>
  54. <div id="kategorie2">
  55.     <div id="kategoriee">
  56.         <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/strzalka.jpg"> <a href="http://wp.pl">Komputery</a>
  57.         <br /><br />
  58.         <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/strzalka.jpg"> <a href="http://adres_strony">Akcesoria komputerowe</a>
  59.         <br /><br />
  60.         <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/strzalka.jpg"> <a href="http://adres_strony">RTV i AGD</a>
  61.         <br /><br />
  62.         <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/strzalka.jpg"> <a href="http://adres_strony">Dom i Ogród</a>
  63.         <br /><br />
  64.         <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/strzalka.jpg"> <a href="http://adres_strony" >Elektronika</a>
  65.         <br /><br />
  66.     </div>
  67. </div>
  68. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/kategorie3.jpg" width=217px height=13px>
  69.  
  70.  
  71.  
  72. <br />
  73. <br />
  74. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/platnosci.jpg" width=217px height=46px>
  75. <div id="kategorie2">
  76.     <div id="kategorie22">
  77.         <center>Wpłata na konto</center>
  78.         <br />
  79.         <center>PKO S.A.</center>
  80.  
  81.         <div id="konto">
  82.         <center>64 1240 5745 1111 0010 1819 1533</center>
  83.         </div>
  84.         <hr>
  85.         Kurier DPD - 22zł
  86.         <br />
  87.         Kurier DPD pobranie - 27zł
  88.     </div>
  89. </div>
  90. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/kategorie3.jpg" width=217px height=13px>
  91.  
  92. <br />
  93. <br />
  94. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/kontakt.jpg" width=217px height=46px>
  95. <div id="kategorie2">
  96.     <div id="kategorie22">
  97.      <center>zinek18@o2.pl</center>
  98.      <br />
  99.  
  100.     gg: 1115955
  101.     <br />
  102.     <div id="konto">
  103.     pisać na gg: pon-pt. 11:00-17:00
  104.     </div>
  105.     <br />
  106.     tel: (0)506342255
  107.     </div>
  108. </div>
  109. <img src="http://www.dociepleniowiec.cal.pl/nettyper/img/kategorie3.jpg" width=217px height=13px>
  110. </div>
  111.  
  112. <div id="strona">
  113.  
  114. <div id="belka">
  115.     <div id="belka_tresc">
  116.         Strona Główna
  117.     </div>
  118. </div>
  119.  
  120. <div id="tresc">
  121.     <div id="tresc2">
  122.         Szanowni Państwo, mamy przyjemność zaprezentować mixer ręczny firmy Ideenwelt
  123.         <br /><br /><br />
  124.         Cechy produktu:<br /> 
  125. na wyposażeniu 2 mieszadła hakowe i 2 trzepaczki<br />
  126. 230V ~ 50Hz<br />
  127. 5-stopniowa regulacja prędkości silnika<br />
  128. przycisk turbo do delikatnego mieszania składników<br />
  129. przycisk zwalniający blokadę końcówek<br />
  130. do błyskawicznego ubijania bitej śmietany, pianki z białek lub mieszania ciasta<br />
  131. gwarancja 12 miesięcy<br />
  132.     </div>
  133. </div>
  134.  
  135.  
  136. </div>
  137.  
  138. </div>
  139.  
  140. </body>
  141. </center>
[HTML] pobierz, plaintext



link do przykładowej aukcji: aukcja
screen:screen
thek
7.11.2009, 23:41:39
<div id="gallery" style="....">
Po kiego czorta Ty ustawiasz temu border i background na biały, skoro ma to być niewidoczne? A przynajmniej tak mi pokazuje Firebug biggrin.gif Po likwidacji tego w style mam wszystko widoczne smile.gif
Marcek190891
7.11.2009, 23:48:21
Nie do konca wiem ocb. Albo ta godzina tak na  mnie wpływa smile.gif. 
thek
8.11.2009, 00:10:40
To wyjaśnię. Uruchomiłem Firefoxa z Firebugiem i zaznaczyłem sobie element który jest cały biały i zasłania kawał strony. Pokazało mi, że to <div id="galeria">, którego umiejscowienie to
html -> body -> div#wrapper -> form -> fieldset#user_field -> div#allGalleryContainer -> id#gallery
Ma on ustawione:
[CSS] pobierz, plaintext 
  1. border: 1px solid rgb(204, 204, 204); margin: 20px auto; padding: 20px 0pt; background: rgb(255, 255, 255) none repeat scroll 0% 0%; width: 420px; position: relative; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous;
[CSS] pobierz, plaintext
Te z -moz olej bo to dodatki Firebuga. Problemem jest tam:
[CSS] pobierz, plaintext 
  1. border: 1px solid rgb(204, 204, 204);
[CSS] pobierz, plaintext
oraz
[CSS] pobierz, plaintext 
  1. background: rgb(255, 255, 255) none repeat scroll 0% 0%;
[CSS] pobierz, plaintext

Usuń to a zniknie białe tło oraz jasna ramka smile.gif
Marcek190891
8.11.2009, 15:22:00
No wlasnie ale to tkwi w plikach allegro i nie da sie tego usunąć. Bo zdjecia sie dodaje przez skrypt allegro. Nie da sie tego wyłączyć jakos swoim kodem np: tworząć diva #gallery z border 0 itd?questionmark.gif TYlko nie wiem jak dokładnie
Blame
8.11.2009, 16:38:57
Kaskadowe arkusze styli cechują się właśnie tym, że są kaskadowe(kto by pomyślał). Po tym co przeczytałem wnioskuje że problemem jest nieprzezroczystość div'a o nazwie galeria. Idąc za ciosem, możesz ustawić mu 100% przezroczystość wtedy niezależnie od narzuconych przez allegro kolorów nie będzie on widoczny. Zrobisz to tym kodem:
[CSS] pobierz, plaintext 
  1. style="filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;"
[CSS] pobierz, plaintext

Małe objaśnienie: filter:alpha jest dla IE, -moz-opacity jest dla firefoxa a opacity dla opery.
Marcek190891
8.11.2009, 17:22:59
Akurat teraz nie moge tego wstawic bo aukcja sie skonczyla a nie chce placic tym bardziej ze to szablon dla kogos. smile.gif Tylko gdzie to wstawic?questionmark.gif Bo jak dam do body to bedzie to działało w zakresie szablonu a nie dla galerii albo ja źle rozumię?




[HTML] pobierz, plaintext 
  1. body { style="filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;" margin: 0 auto; font: 10pt Arial,Tahoma; color: white; padding:0; background-color: #161515; width: 100%; }
[HTML] pobierz, plaintext


Blame
8.11.2009, 17:28:31
jeśli ma działać to musisz to wstawić tak:
tam gdzie jest div galeria dajesz:
[HTML] pobierz, plaintext 
  1. <div id="galeria" style="filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;">
[HTML] pobierz, plaintext

A jeśli div galeria wstawia się sam to w <head> dajesz:
[CSS] pobierz, plaintext 
  1. <style type="text/css">
  2. #galeria {
  3. filter: alpha(opacity=100); 
  4. -moz-opacity: 1; 
  5. opacity: 1;
  6. }
[CSS] pobierz, plaintext

</style>
Powinno działać. Oczywiście jeśli dobrze zrozumiałem twój problem.
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.