Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [css] Obciecie zdjecia - IE dziwnie wyswietla
darth_sidious
post 27.11.2007, 23:18:55
Post #1





Grupa: Zarejestrowani
Postów: 66
Pomógł: 1
Dołączył: 19.12.2005

Ostrzeżenie: (0%)
-----

Witam

Mam taki kod

[HTML] pobierz, plaintext 
  1. <head>
  2.       <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
  3.  
  4. <style type="text/css">
  5.  
  6. div.wrapper {
  7. 	margin:10px;
  8. 	position:relative;
  9. 	float:left;
  10. 	vertical-align:top;
  11. }
  12. div.wrapper img{	
  13. 	float:left;
  14. }
  15. div.wrapper div{	
  16. 	position:absolute;
  17. 	width: 7px;
  18. 	height: 7px;
  19. }
  20. div.wrapper div.tl{
  21. 	background:transparent url(l_g.gif) top left no-repeat;
  22. 	left:0;
  23. 	top:0
  24. }
  25. div.wrapper div.tr{
  26. 	background:transparent url(p_g.gif) top right no-repeat;
  27. 	right:0;
  28. 	top:0
  29. }
  30.  
  31. div.wrapper div.bl{
  32. 	background:transparent url(l_d.gif) bottom left no-repeat;
  33. 	left:0;
  34. 	bottom:0
  35. }
  36. div.wrapper div.br{
  37. 	background:transparent url(p_d.gif) bottom right no-repeat;
  38. 	right:0;
  39. 	bottom:0
  40. }
  41.  
  42. </style>
  43.  
  44.  
  45. </head>
  46.  
  47. <body bgcolor="#1c1c1c">
  48.  
  49.   <div class="wrapper"> 
  50.     <div class="tl"></div> 
  51.     <div class="tr"></div> 
  52.     <div class="bl"></div> 
  53.     <div class="br"></div> 
  54.     <img style="width: 226px; height: 78px; background: transparent url('1_mini.jpg') no-repeat; background-position:center center;\" /></div>
  55.  
  56.  
  57. </body>
  58. </html>
[HTML] pobierz, plaintext


Przycina on zdjecie do konkretnej wysokosci (mierzac od srodka) i wyswietla juz przyciety. Problem polega na tym, ze bez problemu wyswietla sie tylko w Operze. W IE oraz FF wstawia jakas mala ikonke i ramke na cale zdjecie... Gdy zamiast <img stye=".... wstawimy zwykly tag <img> nie ma problemu z wyswietlenie we wszystkich 3 przegladarkach... Wiem, ze cos sknocilem... Tylko co? blinksmiley.gif

link do przykladu tutaj

Pozdrawiam
Darth


--------------------
Fotografia ślubna Tomaszów Mazowiecki
Go to the top of the page
+Quote Post
nevt
post 28.11.2007, 08:37:09
Post #2





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

Ostrzeżenie: (0%)
-----

witam ponownie mój nowy uczniu smile.gif
[PHP] pobierz, plaintext 
  1. <?php
  2. //tutaj...
  3. 	<img style="width: 226px; height: 78px; background: transparent url('1_mini.jpg') no-repeat; background-position:center center;\" />
  4. // po co ten '' na końcu style questionmark.gif
  5. // o ile dobrze przeczuwam co osiągnąć pragniesz, zamień to na
  6. 	<div style="width: 226px; height: 78px; background: transparent url('1_mini.jpg') no-repeat; background-position:center center;" ></div>
  7. // i oczy swe ciesz wynikiem...
  8. ?>
[PHP] pobierz, plaintext

pozdrawiam


--------------------

- Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
darth_sidious
post 28.11.2007, 09:22:04
Post #3





Grupa: Zarejestrowani
Postów: 66
Pomógł: 1
Dołączył: 19.12.2005

Ostrzeżenie: (0%)
-----

Dluga droga jeszcze przede mna, ale kto chce tajniki wszelakie poznac, cierpliwosci i wytrwalosci nauczyc sie musi... Niestety, z ciemna strona ponownie zmierzyc bedzie mi dane... Obraz wyswietla bowiem tak jak chcialem, przyciety, ale bez zaokraglonych rogow... I znow o uzycie Mocy prosic Cie musze... Moze za duzo <div>'ow wkradlo sie w moj kod...

Pozdrawiam
Darth


--------------------
Fotografia ślubna Tomaszów Mazowiecki
Go to the top of the page
+Quote Post
nevt
post 28.11.2007, 11:13:38
Post #4





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

Ostrzeżenie: (0%)
-----

po prostu przesun w kodzie ten <div> z obrazkiem przed <div>'y z naroznikami...
albo nadaj im wszystkim w stylach właściwość z-index... jak nie ma z-indeks to o nakladaniu elementow pozycjonowanych absolutnie decyduje kolejnosc wystapienia znacznika w kodzie...
pozdrawiam.


--------------------

- Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
darth_sidious
post 28.11.2007, 20:31:17
Post #5





Grupa: Zarejestrowani
Postów: 66
Pomógł: 1
Dołączył: 19.12.2005

Ostrzeżenie: (0%)
-----

Faktycznie.... Przenioslem%2

Ten post edytował darth_sidious 28.11.2007, 20:37:19


--------------------
Fotografia ślubna Tomaszów Mazowiecki
Go to the top of the page
+Quote Post
nevt
post 28.11.2007, 20:45:11
Post #6





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

Ostrzeżenie: (0%)
-----

tutaj:
[PHP] pobierz, plaintext 
  1. <?php
  2. <div class="wrapper">
  3. ?>
[PHP] pobierz, plaintext

nadaj temu elementowi taką samą wysokość jak obrazkowi...
względem niego pozycjonujesz, jego wysokość wynosi 0px (bo w srodku jest wszystko ustawiane absolutnie), a tabelka umieszcza go pośrodku komórki (domyślnie), czyli wzgledem tego elementu top=0px wskazuje na śridek komórki tabeli...
powodzenia.


--------------------

- Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 5.07.2025 - 11:25
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn