Re: stała szerokość kolumn w tabeli - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › stała szerokość kolumn w tabeli › Re: stała szerokość kolumn w tabeli

Path: news-archive.icm.edu.pl!news.icm.edu.pl!opal.futuro.pl!news.internetia.pl!not-f
or-mail
From: ramblinman <%nick%@gazeta.pl>
Newsgroups: pl.comp.www
Subject: Re: stała szerokość kolumn w tabeli
Date: Tue, 13 Sep 2011 23:53:08 +0200
Organization: Netia S.A.
Lines: 58
Message-ID: <j4ojes$qu$1@mx1.internetia.pl>
References: <j4oe7b$avt$1@inews.gazeta.pl> <j4oi6d$o4a$1@mx1.internetia.pl>
NNTP-Posting-Host: 87-205-182-206.adsl.inetia.pl
Mime-Version: 1.0
Content-Type: text/plain; charset=UTF-8; format=flowed
Content-Transfer-Encoding: 8bit
X-Trace: mx1.internetia.pl 1315950876 862 87.205.182.206 (13 Sep 2011 21:54:36 GMT)
X-Complaints-To: a...@i...pl
NNTP-Posting-Date: Tue, 13 Sep 2011 21:54:36 +0000 (UTC)
In-Reply-To: <j4oi6d$o4a$1@mx1.internetia.pl>
X-Tech-Contact: u...@i...pl
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:6.0.2) Gecko/20110902 Thunderbird/6.0.2
X-Server-Info: http://www.internetia.pl/
Xref: news-archive.icm.edu.pl pl.comp.www:399467
[ ukryj nagłówki ]
W dniu 2011-09-13 23:31, ramblinman pisze:
> Zauważ też, że jeśli komórka nie ma określonej wysokości (tak jak tutaj
> 200px), to ewentualny pasek będzie zaraz w miejscu, gdzie kończy się tekst.

Poprawka - wtedy w ogóle nie działa. Zapomniałem do czego to stosowałem.
Wysokość jest wymagana. Tutaj rozwiązanie niewymagające określania
wysokości komórki:

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<style type="text/css">
table{
border-collapse:collapse; table-layout:fixed;
}

td{
border: 1px solid black; vertical-align: top;
}

td div{
overflow-x:hidden; height: 100%;
}

.c0, .c0 div{
width: 200px;
}

.c1, .c1 div{
width: 100px;
}

.c2, .c2 div{
width: 75px;
}

.c3, .c3 div{
width: 50px;
}
</style>
</head>
<body>
<table>
<tr>
<td class="c0"><div>testtesttesttesttesttesttest<br /> test test
test test test test test test </div></td>
<td class="c1"><div>testtesttesttesttesttesttest<br /> test test
test test test test test test </div></td>
<td class="c2"><div>testtesttesttesttesttesttest<br /> test test
test test test test test test </div></td>
<td class="c3"><div>testtesttesttesttesttesttest<br /> test test
test test test test test test </div></td>
</tr>
</table>
</body>
</html>