Forum PHP.pl > [html/css]obrazek w naglowku tabelki

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [html/css]obrazek w naglowku tabelki

Yard

1.10.2006, 12:35:06

witam
mam pewnie problem z odpowiednim wyswietleniem obrazka w tle naglowka tabelki.
mam taki kod:

[HTML] pobierz, plaintext 
<tr class="thHead">
	<th colspan="2" class="thTop">pole1</th>
        <th class="thTop">pole2</th>
        <th class="thTop">pole3</th>
        <th class="thTop">pole4</th>
  </tr>
[HTML] pobierz, plaintext

i chce, zeby caly ten rzad (tr) mial w swoim tle jeden obrazek (w sensie jeden obrazek na dlugosc czterech kolumn)
probowalem kombinowac: jesli dam ten obrazek jako tlo w thHead, to w poszczegolnych komorkach sie nie wyswietla, znalazlem atrybut "background-image: inherit", ale wtedy w kazdej z osobna wysiwetla sie ten obrazek od poczatku.
ten naglowek wystepuje w kilku miejscach w roznych proporcjach, wiec nie moge obrazka podzielic,
czy takie cos da sie w ogole jakos zrobic?

z gory dziekuje za odpowiedz
pzdr

Wieviór

1.10.2006, 14:52:25

A co to jest th? Może błąd wynika z braku zamknięca colspan="2...?

Yard

1.10.2006, 17:03:55

<th> - tag naglowka tabeli
a colspana niedomknalem tutaj przez przypadek, w kodzie mam dobrze, nie chodzi o to, ze mam blad, tylko nie wiem jak sie do tego zabrac

s_w_ir

1.10.2006, 22:06:39

css

Kod

tr.tlo
{
background: url(tlo.png);
}

[HTML] pobierz, plaintext 
<tr class="tlo">
[HTML] pobierz, plaintext

próbowałeś tak?

Dla th daj tlo transparent.

Yard

1.10.2006, 22:45:42

dzieki, ladnie dziala pod Fx, ale nIEstety nie pod IE...
obrazek sie tam w ogole nie wyswietla

bylaby dla IE jakas alternatywa?

s_w_ir

1.10.2006, 23:01:40

Kod

tr.tlo
{
background: url(logo.gif);
}
th.thTop
{
background-color: transparent;
}

Teraz działa

Zawsze sie czegoś człowiek nauczy na problemach innych

okazało się że IE olało mój transparent w samym background, ale zrozumiało go w background-color

Yard

2.10.2006, 14:39:47

dzieki, zrobilem tak jak napisales, ale IE znowu jakos nielogicznie to zinterpretowalo...

tak to wyglada teraz:

Firefox:

IE:

jak widac kazdej komorce osobno przypisuje ten sam obrazek od poczatku, tak jak przy background: inherit, co jest troche dziwne...
jakies sugestie?

s_w_ir

2.10.2006, 16:56:07

Kurde rzeczywiscie IE robi inherit, i nie moge tego obejść :/ Jeszcze pokombinuje ale coś czarno to widze :/
Jak coś to zrobie edit...

Wieviór

3.10.2006, 07:18:30

W CSS zapisz sobie:

[HTML] pobierz, plaintext 
.thHead { BACKGROUND-IMAGE: url(plik.jpg); }
[HTML] pobierz, plaintext

Kod zrób taki:

[HTML] pobierz, plaintext 
<head>
<link href="style.css" type=text/css rel="stylesheet">
</head>
 
<table cellspacing="0">
<tr class="thHead">
<th colspan="2">pole1</th>
<th>pole2</th>
<th>pole3</th>
<th>pole4</th>
</tr>
</table>
[HTML] pobierz, plaintext

Pod FF normalnie działa, bez żadnych komplikacji.

EDIT: Niedoczytałem, sorry.

s_w_ir

3.10.2006, 11:33:15

Wieviór, czytasz w ogóle? Pod FF to działa od dłużeszgo czasu problem jest że IE dziedziczy niepotrzebnie. Sprawdź kody co my podaliśmy, są takie same

Yard

14.10.2006, 18:01:20

dzisiaj wrocilem do tego i udalo mi sie wreszcie rozwiazac ten problem

pisze, bo moze komus sie to kiedys przyda

w IE trzeba to niestety na okolo robic, ale znalazlem atrybut CSS background-position
dzieki niemu jest wiecej pisania, ale ustala sie pozycje obrazka tla dla kazdej komorki i IE wreszcie to dobrze interpretuje

kod html teraz:

[HTML] pobierz, plaintext 
<tr class="thHead">
<th colspan="2" class="thLeft">pole1</th>
<th class="thTop">pole2</th>
<th class="thTop">pole3</th>
<th class="thRight">pole4</th>
</tr>
[HTML] pobierz, plaintext

css:

[HTML] pobierz, plaintext 
th.thLeft
{
background: url(plik.jpg) bottom left;
}
 
th.thRight
{
background: url(plik.jpg) bottom right;
}
 
th.thTop
{
background: url(plik.jpg) bottom center;
}
[HTML] pobierz, plaintext

IE should be banned.

pzdr

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.