Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][CSS]jak usunac zaokraglone rogi obrazka jako tla tabeli
nieraczek
post
Post #1





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

Mam:
[HTML] pobierz, plaintext 
  1. <table class="tabela_szara" cellspacing="0" cellpadding="0">
  2. <tr class="szary_naglowek_tabeli">
  3. <th></th>
  4. <th></th>
  5. <th></th>
  6. </tr>
  7. ................
  8. </table>
  9.  
  10. ----------------------------------
  11.  
  12. .szary_naglowek_tabeli
  13. {  
  14. 	height: 47px;
  15. 	background-image: url(../images/naglowek_tabeli.png);
  16.         background-repeat: no-repeat;
  17. 	width: 200px;
  18. }
[HTML] pobierz, plaintext


Obrazek jest wystarczająco długi by wypełnić cały wiersza tabeli, tymczasem w IE6, IE7 i google Chrome w każdej komórce zaczyna się on od początku przez co ponieważ obrazek jest zaokrąglony widać coś takiego (zaznaczyłem czerwonym kółkiem te miejsca):
(IMG:http://img24.imageshack.us/img24/7716/beztytuumlg.jpg)

Da się to usunąć ?

Ten post edytował nieraczek 30.07.2009, 19:32:10
Go to the top of the page
+Quote Post
Spawnm
post
Post #2





Grupa: Moderatorzy
Postów: 4 069
Pomógł: 497
Dołączył: 11.05.2007
Skąd: Warszawa
Proszę dodać tagi do tematu.
Go to the top of the page
+Quote Post
nieraczek
post
Post #3





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

Sry, już dodałem tagi, a co odnośnie mego problemu, pomoże ktoś ? (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
marian2299
post
Post #4





Grupa: Zarejestrowani
Postów: 272
Pomógł: 9
Dołączył: 6.06.2009

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

Daj link do obrazka.
Go to the top of the page
+Quote Post
nieraczek
post
Post #5





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

link do obrazka: http://yfrog.com/0nnaglowektabelip (obrazek z rozszerzeniem .png bo zawiera wokół siebie przezroczystość)

kod:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html lang="cs">  
  3.   <head>    
  4.     <meta http-equiv="content-type" content="text/html; charset=windows-1250">    
  5.     <meta name="generator" content="PSPad editor, www.pspad.com">    
  6.     <title>Untitled
  7.     </title>    
  8.     <style type="text/css">        
  9.     .szary_naglowek_tabeli
  10.     {
  11.       height: 47px;
  12.       background-image: url(naglowek_tabeli.png);
  13.       background-repeat: no-repeat;
  14.       width: 200px;
  15.     }
  16.     .tabela_szara
  17.     {  
  18.       width: 439px;
  19.     }     
  20.     </style>  
  21.   </head>  
  22.   <body>  
  23.  
  24.     <table class="tabela_szara" cellspacing="0" cellpadding="0">
  25.       <tr class="szary_naglowek_tabeli">
  26.         <th>tekst1</th>
  27.         <th>tekst2</th>
  28.         <th>tekst3</th>
  29.       </tr>
  30.     </table>  
  31.  
  32.   </body>
  33. </html>
[HTML] pobierz, plaintext


Ten post edytował nieraczek 30.07.2009, 20:34:58
Go to the top of the page
+Quote Post
marian2299
post
Post #6





Grupa: Zarejestrowani
Postów: 272
Pomógł: 9
Dołączył: 6.06.2009

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

Zobacz tak:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  5. <title>Untitled
  6. </title>
  7. <style type="text/css">
  8. .szary_naglowek_tabeli
  9. {
  10. height: 47px;
  11. background-image: url('naglowektabeli.png');
  12. background-repeat: no-repeat;
  13. width: 200px;
  14. }
  15. .tabela_szara
  16. {
  17. width: 439px;
  18. }
  19. </style>
  20. </head>
  21. <body>
  22.  
  23. <table class="tabela_szara" cellspacing="0" cellpadding="0">
  24. <tr class="szary_naglowek_tabeli">
  25. <td>tekst1</td>
  26. <td>tekst2</td>
  27. <td>tekst3</td>
  28. </tr>
  29. </table>
  30.  
  31. </body>
  32. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
nieraczek
post
Post #7





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

niestety bez zmian
Go to the top of the page
+Quote Post
bogdan89
post
Post #8





Grupa: Zarejestrowani
Postów: 320
Pomógł: 36
Dołączył: 28.08.2006
Skąd: Wrocław

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

wiem, że to może być rozwiązanie problemu "na około", "młotkiem", albo jeszcze inaczej, ale powiem co ja bym zrobił w takiej sytuacji...

podzieliłbym ten plik na trzy. lewy, środkowy i prawy.
Odpowiednie rozdzielenie pozwoli Ci zapewne jeszcze zaoszczędzić kilka KB.

i wtedy:
[HTML] pobierz, plaintext 
  1. <table class="tabela_szara" cellspacing="0" cellpadding="0">
  2. <tr>
  3. <th class="lewy">tekst1</th>
  4. <th class="srodek">tekst2</th>
  5. <th class="prawy">tekst3</th>
  6. </tr>
  7. </table>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
athei
post
Post #9





Grupa: Zarejestrowani
Postów: 389
Pomógł: 141
Dołączył: 11.04.2009

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

Użyj czegoś takiego :
[HTML] pobierz, plaintext 
  1. <table class="tabela_szara" cellspacing="0" cellpadding="0">
  2. <tr class="szary_naglowek_tabeli">
  3. <th style="background: url(naglowektabeli.png) no-repeat 0 0;">tekst1</th>
  4. <th style="background: url(naglowektabeli.png) no-repeat 50% 0;">tekst2</th>
  5. <th style="background: url(naglowektabeli.png) no-repeat 100% 0;">tekst3</th>
  6. </tr>
  7. </table>
[HTML] pobierz, plaintext


Żeby przezroczysty png zadziałał w ie6 to http://24ways.org/2007/supersleight-transparent-png-in-ie6

Ten post edytował athei 31.07.2009, 08:19:16
Go to the top of the page
+Quote Post
marian2299
post
Post #10





Grupa: Zarejestrowani
Postów: 272
Pomógł: 9
Dołączył: 6.06.2009

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

nieraczek, ściągnąłem sobie ten obrazek, i sprawdziłem. U mnie działa.

Skrin w powiększeniu (CTRL + ++) : http://iv.pl/images/9tnqws5xaie96kelemin.jpg

Ten post edytował marian2299 31.07.2009, 16:52:36
Go to the top of the page
+Quote Post
nieraczek
post
Post #11





Grupa: Zarejestrowani
Postów: 405
Pomógł: 6
Dołączył: 12.01.2007

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

bogdan jest to jakieś wyjście, aczkolwiek sposób athei wydaje się ciekawszy - obawiałem się co będzie w przypadku 4. komórek w sposobie athei - wtedy trzeba by było podzielić to w ten sposób: 0 / 33 / 66 / 100 - jednak moje obawy się nie sprawdziły - wciąż jest ok (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Dzięki

marian2299 Tobie działa, bo sprawdzałeś na FF, trzeba było sprawdzić w badziewnym IE6 lub IE7 (IMG:http://forum.php.pl/style_emoticons/default/biggrin.gif) (nie w IE8 - bo tam na szczęście było ok)

Ten post edytował nieraczek 31.07.2009, 19:10:43
Go to the top of the page
+Quote Post
marian2299
post
Post #12





Grupa: Zarejestrowani
Postów: 272
Pomógł: 9
Dołączył: 6.06.2009

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

Heh, nie rób stron pod IE6 czy 7 bo to ZuO! (IMG:http://forum.php.pl/style_emoticons/default/haha.gif) .
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 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 Aktualny czas: 21.09.2025 - 04:46
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn