Enkla tabeller med CSS istället

8 svar · 469 visningar · startad av petergrennanet 25 apr. 2004

petergrennanetMedlem sedan dec. 1999258 inlägg

Frågan25 apr. 2004 14:21#1

För alla CSS experter kanske detta är en enkel fråga, men jag sliter fortfarande med det.

Jag vill ersätta:

<table align="center">
<tr>
  <td valign="top">Something something</td>
  <td valign="top">Anything anything</td>
</tr>
</table>

...och...

<table align="center" width="99%">
<tr>
  <td valign="top">Nånting</td>
  <td valign="top" align="right">Annat</td>
</tr>
</table>

...till CSS. Det är inte mer komplicerat än så. Det är inte fråga om avancerade menyer eller nånting. Det är bara text spritt sidledes.

Web-TorMedlem sedan nov. 200013 890 inlägg

25 apr. 2004 14:26#2

valign = vertical-align
align = text-align

Sedan beror det på hur du vill lägga in CSS på sidan.
Deu kan t.ex. göra det så här:

<td style="text-align:top;">Nånting</td>

dectgapMedlem sedan sep. 20021 655 inlägg

25 apr. 2004 14:27#3

<p style="text-align: center">
  Something something
  Anything anything
</p>

<p style="width: 99%; margin-left: auto; margin-right: auto">
  <span style="float: left">Nånting</span>
  <span style="float: right">Annat</span>
  <br style="clear: both" />
</p>

MeleaMedlem sedan juli 20033 147 inlägg

25 apr. 2004 14:27#4

<table style="text-align: center;">
<tr>
  <td style="vertical-align: top;">Something something</td>
  <td style="vertical-align: top;">Anything anything</td>
</tr>
</table>

<table style="text-align: center; width: 99%;">
<tr>
  <td style="vertical-align: top;">Nånting</td>
  <td style="vertical-align: top; text-align: right;">Annat</td>
</tr>
</table>

Edit: Det gick la fort där ;)

petergrennanetMedlem sedan dec. 1999258 inlägg

25 apr. 2004 14:37#5

Tack dectgap! Du är min nya hjälte.

TroxyMedlem sedan mars 20041 505 inlägg

26 apr. 2004 08:33#6

Orka med en hel tabelljävel:

<div style="text-align: left; width: 50%; position: absolute;">Nånting</div>
<div style="text-align: right; width: 100%; position: absolute;">Annat</div>

jarvkloMedlem sedan juli 20013 378 inlägg

26 apr. 2004 09:04#7

Först vill jag bara säga Välkommen till wF Troxy!
Men sedan måste jag också tyvärr be dig att tänka över ditt språkval när du svarar på frågor här (se §4 i wF:s regler )

Hälsar
/Jarvklo - Moderator HTML, XHTML & CSS

petergrennanetMedlem sedan dec. 1999258 inlägg

26 apr. 2004 09:37#8

Troxy, när jag testade din kod fick jag en horizontell scroll i Firefox.

TroxyMedlem sedan mars 20041 505 inlägg

26 apr. 2004 21:29#9

Ursäkta mitt språk då. :)

Jag gjorde den där koden lite snabbt. Men det jag vill få fram är, att det går att göra om hela tabell-koden till CSS. Då går allt mycket smidigare.

Testa denna kod istället:

<div style="text-align: left; width: 50%; position: absolute;">Nånting</div>
<div style="text-align: right; width: 50%; position: absolute; left: 50%;">Annat</div>