[css] w tabeli

[Erbit]

Słabo znam CSS

Mam linie tabel1

<TR><TD>

<a hraf>tekst1</a>

<a hraf>tekst2</a>

</td></tr>

Chcialem dolozyc zroznicowanie barwami i kolorami, dolozylem wiec DIV

<TR><TD>

<a hraf><div style="font-size: 120%; color: #00f;">tekst1</div></a>

<a hraf><div style="color: #000;">tekst2</div></a>

</td></tr>

Niestety po tych zmianach tekst wyswietla sie tak

tekst1
tekst2

czyli jeden pod drugim zamiast jeden obok drugiego.

Gdzie robię błąd?

[mess_alex]

Witam,

nawet nie wiesz, jak się cieczę, żę mogę Ci pomóc

dopisz display: inline; do div'ów

Pozdrawiam

[Erbit]

nawet nie wiesz, jak się cieczę, żę mogę Ci pomóc

Raz ja Tobie raz Ty mnie.. od tego jest forum. Ja też się cieszę - dziękuję.

[edyta]

i juz sprawdzilem, działa..

Jeszcze raz dziekuje.

[pabel]

ja radziłbym ci tak

zrobić plik style.css

podłączyć go do pliku htm czy php

w nagłówku

<LINK href="style.css" rel=stylesheet>

Jeśli nie potrzebujesz podświetlenia linku to wystarczy w style.css

a.linia1 {
 text-decoration:  none;
 color:    #FF0000;
}
a.linia2 {
 text-decoration:  none;
 color:    #00FF00;
}

a jeśli dodatkowo ma zmieniać kolor i podkreślać to w samym css

a.linia1 {
 text-decoration:  none;
 color:    #FF0000;
}
a.linia1:hover {
 text-decoration:  underline;
 color:    #000000;
 }
a.linia2 {
 text-decoration:  none;
 color:    #00FF00;
}
a.linia2:hover {
 text-decoration:  underline;
 color:    #000000;
 }

natomiast kod na stronie

zmienić na

<TR><TD>
<a href="cos" class="linia1">tekst1</a>
<a href="cos" class="linia2">tekst2</a>
</td></tr>

[Erbit]

ja radziłbym ci tak

zrobić plik style.css

podłączyć go do pliku htm czy php

w nagłówku

Tak to robie, style z poprzedniego przykladu przenosze do zewnetrznego arkusza styli ale: rozwiazanie, które podałeś jest czytelniejsze i mniejsze pod wzgledem kodu.

Na pewno bede przerabial, szukalem rozwiazanie - mess_alex odpowiedzial wprost na postawione pytanie i jego odpowiedz tez sie przyda.

Dziekuje.

[edyta]

Coz dodac... CSS to jest to !

pabel

Zrobiłem to w zewnętrznym stylu CSS, w oparciu o 'class' i o dziwo działa! Dodatkowo w :hover zmieniam kolor i procentowo wielkość czcionki... i działa.

Dziekuje.

[Elf]

Erbit, zrobiles blad strukturalny. Tag <a> jest elementem inline, a tag <div> elementem blokowym. Element blokowy nie moze byc w inline, ale kazdy inline musi byc w jakims blokowym. Sprwdz walidatorem, przeczytaj dokumentacje

[camelleon]

moje pytanie pasuje do tematu

jak za pomoca css pozbyc sie w ogole tabeli?

mam np:

<table width=438 align="center" border=1 bordercolor="#FDDF85"><tr>
<td align="center" width="35%">
</td>
<td  align="center" width="30%">
</td>
<td  align="center" width="35%">
</td>
</tr></table>

i jak to zrobic bez uzywania table?

[Elf]

camelleon, polecam czytanie przyklejonych topicow

https://www.forum.optymalizacja.com/index.php?showtopic=5636

[nrm]

3 x div inline.

linki do przykładów w przyklejonym temacie w tym dziale.

edit: nedobry Elf, ubiegł mnie

[camelleon]

czytalem ten przyklejony topic

tzn. zaczalem go czytac i tak doszedlem do pierwszego linku:

https://nf.hyperreal.info/patrz/pubudka-tablarza/

i tam: Najpierw kup "Projektowanie serwisów WWW. Standardy sieciowe".

Prawde mowiac przymierzam sie do tego, ale przeczytanie calego topiku i wszystkich linkow to jakis tydzien siedzenia non stop

mialem wiec nadzieje ze ktos mnie tu przykladme wspomoze

ale widze ze bez lektury topiku i ksiazki daleko nie ujade

no coz pozostaje wziac urlop i zabrac sie do czytania

[vel]

a wystarczyłoby camelleon przejrzeć tytuły wątków w tym dziale

jest tam mój wątek właśnie o layout 3-kolumnowy o który ci chodzi

tu masz link do posta z linkiem do fajnego layoutu 3-kol https://www.forum.optymalizacja.com/index.php?s...indpost&p=91098

[camelleon]

dzieki vel

na Ciebie zawsze mozna liczyc

i powiem Ci juz kiedys przegladalem tego posta ale jakos mi umknelo :|

thx

[Erbit]

Erbit, zrobiles blad strukturalny...

Dziekuje... Moj temat jest zamkniety.. trzeba go zostawic dla potomnych. Masz racje co do zasady ale juz mam to inaczej rozwiazane i nie mam tego błędu.

Wykonałem to zgopdnie z zaleceniam forowicza pabel a uwagę mess_alex wykorzystałem w innym miejscu.

[Szern]

Witam!

Ideą CSS-a jest: tabele służą do robienia tabel, a nie do tworzenia układu strony...

A więc css wygląda na przykład tak:

div.row { clear: both; padding-top: 5px; }
div.row span.label { float: left; width: 100px; text-align: right; }
div.row span.formw { float: right; width: 235px; text-align: left; }

A przykładowa "tabela" tak:

<div style="width: 360px; background-color: #ccc; border: 1px dotted #333; padding: 5px; margin: 0px auto;">
<form>
<div class="row">
<span class="label">Name:</span>
<span class="formw"><input type="text" size="25" /></span> 
</div>
<div class="row">
<span class="label">Age:</span>
<span class="formw"><input type="text" size="25" /></span>
</div>
<div class="row">
<span class="label">Shoe size:</span>
<span class="formw"><input type="text" size="25" /></span>
</div>
<div class="row">
<span class="label">Comments:</span>
<span class="formw"><textarea cols="25" rows="8"> Go ahead - write something... </textarea></span> </div>
<div class="spacer">   </div>
</form>
</div>

I po tabeli...

Przykład wyciągnąłem stąd i używam go w praktyce. Polecam, ułatwia życie.

Pozdrawiam