[CSS]DIV wewnątrz TD wypełniający go w całości, Jak zrobić? Opcje

[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]

[CSS] pobierz, plaintext 
height: 100%;
width: 100%;
[CSS] pobierz, plaintext 

?

[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 (IMG:style_emoticons/default/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 (IMG:style_emoticons/default/ohno-smiley.gif)

Jak dodałem do TD treść " " (twarda spacja), to już się border pokazuje (IMG:style_emoticons/default/wink.gif)

Ten post edytował Blackhole 26.07.2014, 18:52:17

[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 (IMG:style_emoticons/default/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]

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 (IMG:style_emoticons/default/sad.gif)

[trueblue]

http://jsfiddle.net/xFUx8/5/