Witam,

Moim zadaniem jest zbudowanie galerii logotypów partnerów w postaci paru
wierszy po kilka logo we wierszu. Każde zdjęcie (logo) musi być wycentrowane
w swojej "komórce" w pionie i w poziomie. Kazda z tych komórek będzie miała
jednkakowe (białe) tło. Między komórkami będzie stały odstęp (brak tła).
Samo sformułowanie "komórka" nasuwa realizację zadania za pomocą tabeli.
Chciałbym dowiedzieć się czy właściwie podchodzę do realizacji odrzucając
CSS i DIVy? Z tego co pamiętam, to zadanie jest niewykonalne na CSS i
DIVach.

Pozdrawiam,
Marek

do góry

Marek pisze:
> Witam,
>
> Moim zadaniem jest zbudowanie galerii logotypów partnerów w postaci paru
> wierszy po kilka logo we wierszu. Każde zdjęcie (logo) musi być wycentrowane
> w swojej "komórce" w pionie i w poziomie. Kazda z tych komórek będzie miała
> jednkakowe (białe) tło. Między komórkami będzie stały odstęp (brak tła).
> Samo sformułowanie "komórka" nasuwa realizację zadania za pomocą tabeli.
> Chciałbym dowiedzieć się czy właściwie podchodzę do realizacji odrzucając
> CSS i DIVy? Z tego co pamiętam, to zadanie jest niewykonalne na CSS i
> DIVach.

Osobiście poszedłbym w kierunku zwykłej listy <ul>. Chociaż z drugiej
strony zdjęcia to również dane, które IMHO semantycznie pasują do
tabeli. Np.:

<table>
<caption>Tabela zdjęć</caption>
<thead><tr><th>L.p.</th><th>Nazwa zdjęcia</th><th>Zdjęcie</th></tr></thead>
<tbody><tr><td>1</td><td>Opis zdjęcia</td><td><img.../></td></tr></tbody>
</table>

Hm...

--
Peter

do góry

> Osobiście poszedłbym w kierunku zwykłej listy <ul>. Chociaż z drugiej
> strony zdjęcia to również dane, które IMHO semantycznie pasują do tabeli.
> Np.:
>
> <table>
> <caption>Tabela zdjęć</caption>
> <thead><tr><th>L.p.</th><th>Nazwa
> zdjęcia</th><th>Zdjęcie</th></tr></thead>
> <tbody><tr><td>1</td><td>Opis zdjęcia</td><td><img.../></td></tr></tbody>
> </table>

Tabela dla mnie jest ostatecznością ponieważ jest z nią problem tego typu,
że odstęp między komórkami rysuje się wokół nich. Tymczasem odstęp chciałbym
trzymać po prawej i na dole od komórki. Chcę ją zastosować tylko dlatego, że
a się centrować obrazek w pionie.

Czy w <ul> da się wyrównywać w pionie zawartość tego co jest w <li> ?

do góry

Marek wrote:
> Czy w <ul> da sie wyrównywaae w pionie zawarto?ae tego co jest w <li> ?

Jeżeli mowa o <img/>, to tak - ustawiasz line-height na maksymalną
wysokość obrazka i dla img { vertical-align:middle; }

do góry

> Jeżeli mowa o <img/>, to tak - ustawiasz line-height na maksymalną
> wysokość obrazka i dla img { vertical-align:middle; }

Bardzo sprytne ! :-)
A czy jest jakiś sposób na wyrównanie w pionie dowolnej zawartości
"komórki". Zakładam, że "komórka" ma narzuconą wysokość.

do góry

> Tabela dla mnie jest ostatecznością ponieważ jest z nią problem tego typu,
> że odstęp między komórkami rysuje się wokół nich. Tymczasem odstęp
> chciałbym trzymać po prawej i na dole od komórki. Chcę ją zastosować tylko
> dlatego, że a się centrować obrazek w pionie.

Do ustalania tych wartości służą polecenia cellpadding i cellspacing np.:
<table cellpadding=0 cellspacing=5> oznacza, że margines zewnętrzy między
komórkami ma wynosić 0px, a margines wewnętrzny w komórce 5px. Jeżeli nie
zdefiniujesz tych wartości to cellpadding i cellspacing są standardowo
ustawiane na 1px - stąd odstępy między komórkami.

do góry

Marek pisze:
>> Jeżeli mowa o <img/>, to tak - ustawiasz line-height na maksymalną
>> wysokość obrazka i dla img { vertical-align:middle; }
>
> Bardzo sprytne ! :-)
> A czy jest jakiś sposób na wyrównanie w pionie dowolnej zawartości
> "komórki". Zakładam, że "komórka" ma narzuconą wysokość.

Wprawdzie mowa o tekście, ale... spróbuj coś poszukać tutaj:
http://www.cssmania.pl/csswiki/index.php?title=Cente
ringTextVertically

--
Peter

do góry

> Do ustalania tych wartości służą polecenia cellpadding i cellspacing np.:
> <table cellpadding=0 cellspacing=5> oznacza, że margines zewnętrzy między
> komórkami ma wynosić 0px, a margines wewnętrzny w komórce 5px. Jeżeli nie
> zdefiniujesz tych wartości to cellpadding i cellspacing są standardowo
> ustawiane na 1px - stąd odstępy między komórkami.


Tak, to wiem. A jak zdefiniować aby cellspacing po lewej i u góry wynosił 0
a po prawej i na dole 10 ? Właśnie o tym mowa.

do góry

> Wprawdzie mowa o tekście, ale... spróbuj coś poszukać tutaj:
> http://www.cssmania.pl/csswiki/index.php?title=Cente
ringTextVertically

Dzięki :)
Poczytałem sobie. Jest jakieś tam obejście jednakże kodu i to lewego trzeba
sporo napakować aby to działało. 3 div'y zagnieżdżone plus style, które
rozumie IE a ignorują inne browsery - to już walka z wiatrakami. Tabela to
pikuś przy takim rozwiązaniu. Chyba trzeba zaczekać na kolejne wersje IE
albo na śmierć tej przeglądarki. Do tego czasu prościej stosować tabele -
chyba to właściwy morał.

do góry

Marek pisze:
>> Do ustalania tych wartości służą polecenia cellpadding i cellspacing np.:
>> <table cellpadding=0 cellspacing=5> oznacza, że margines zewnętrzy między
>> komórkami ma wynosić 0px, a margines wewnętrzny w komórce 5px. Jeżeli nie
>> zdefiniujesz tych wartości to cellpadding i cellspacing są standardowo
>> ustawiane na 1px - stąd odstępy między komórkami.
>
>
> Tak, to wiem. A jak zdefiniować aby cellspacing po lewej i u góry wynosił 0
> a po prawej i na dole 10 ? Właśnie o tym mowa.

table{
border-collapse:collapse;
}
td{
padding:0 0 1em 1em;
}

--
Peter

do góry