Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS]DIV wewnątrz TD wypełniający go w całości
Forum PHP.pl > Forum > Przedszkole
Blackhole
Hej.
Potrzebuję zrobić, by DIV umieszczony w elemencie TD wypełniał go w całości. To znaczy, że gdy w DIV jest np. tylko 1 znak, a zawartość pozostałych elementów TD w tym samym wierszu, w którym jest TD z tym DIV-em, powodują, iż elementy TD mają znaczną wysokość, to DIV ma być tak samo duży, jak te elementy TD.
Chcę uzyskać efekt, by cała komórka TD miała jakiś zadany background (ale musi to być przez DIV wewnątrz TD, a nie przez ustawienie background dla TD).
Pomóżcie, proszę...
pedro84
  1. height: 100%;
  2. width: 100%;

?
Blackhole
Taka oczywistość nie działa, sprawdzałem już.
trueblue
http://jsfiddle.net/xFUx8/
Blackhole
trueblue, to nie całkiem to, czego potrzebuję. Gdy wpiszę coś do tego DIV-a czerwonego, to TD cały czas jest tak samo szeroki i wysoki (bo jest "position: absolute"). Potrzebuję, by się dostosowywał do zawartości.

Coś zadziałało smile.gif Popsuło się jednak coś innego. TD miał ustawiony "border", a teraz, gdy w nim jest ten DIV z "position: absolute", to border nie jest pokazywany, bo przeglądarka wyświetla go tylko wtedy, gdy TD nie jest pusty (ma coś w sobie). W przypadku "position: absolute" przyglądarka myśli, że TD jest pusty ohno-smiley.gif

Jak dodałem do TD treść " " (twarda spacja), to już się border pokazuje wink.gif
trueblue
http://jsfiddle.net/xFUx8/3/
pedro84
W Firefoxie ten div nie 100% wysokości. Chyba metody skutecznej w stu procentach w czystym CSS nie ma.
Blackhole
A jak w IE to zrobić, bo nie wypełnia całego TD, a tylko górną część o wysokości linijki tekstu ohno-smiley.gif
czychacz
na css się za bardzo nie znam, a dodatkowo nie mam ie do przetestowania, ale spróbuj pobawić się z:
Kod
table td{
    position: relative;
    width: 100px;
}
table td div{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background:#f00;
}
Blackhole
Cytat(pedro84 @ 26.07.2014, 19:09:49 ) *
W Firefoxie ten div nie 100% wysokości. Chyba metody skutecznej w stu procentach w czystym CSS nie ma.
To może jakaś nie czysto CSS-owa? Zadowolę się, jeśli będzie konieczne dodanie dodatkowego elementu DIV (na przykład).

Ta twarda spacją, którą dodałem, by pojawiał się border, teraz mi przeszkadza.
Niby prosta sprawa => do TD dać coś, co wypełni cały ten element... a jednak ciężka sprawa z tym sad.gif
trueblue
http://jsfiddle.net/xFUx8/5/
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.