En CSS-fråga.

Hej

Jag ska bygga upp en sida där det är en rubrik, sedan under rubriken är det flera länkar sedan ska det radas bredvid varandra.

Ungefär så här ska det se ut:

Rubrik Rubrik2
Länk1 Länk1
Länk2 Länk2
Länk3 Länk3

Jag undrar nu hur jag ska göra detta. Det borde ju gå att lösa med att man gör en div för varje rubrik + länkarna som hör till den rubriken, men det blir kanske lite mycket divs, går det att lösa på nått smidigare sätt, att man kanske kan göra så att <ul>-lägger sig på samma rad bredvid varandra?

Vill du ha det uppställt i tabellform så ska du inte vara rädd att använda en tabell tycker jag. Hur mycket vissa n00bs än försöker övertyga dig om det, så är det inte fel att använda tabeller när det passar.

Skarre, utveckla vad du menar med n00bs.

I detta fall ser jag inget problem med att använda tabeller eftersom det är just en tabell med länkar du vill bygga.

Jag tror de "n00bs" Skarre syftar på är de up-to-date-webbutvecklare som vet att det är dåligt att använda tabeller för design och att CSS är vägen att gå i stället. I och med det så tror dessa "n00bs" att tabeller inte är något man ska använda över huvud taget, vilket är helt fel att tro.

Och precis som i tidigare svar: vill du ha något uppställt i tabellform - använd då tabeller! :)

En följdfråga då..
Om man ska bygga upp en formulär, ex:

Namn	Input="Namn"
Email	Input="Email"

Är detta smidigast att bygga upp med tabeller, eller går det att lösa på ett snyggt sätt med div/css?

Tabell eller inte för att strukturera formulär? :D

Okej, så vad jag förstår så är det alltså bättre, och snyggare, att använda sig av <label>? :)

LABEL bör man alltid använda i samband med formulär, oavsett om man använder tabeller eller inte. :)

MagnusJ skrev:

Ungefär så här ska det se ut:

Rubrik Rubrik2
Länk1 Länk1
Länk2 Länk2
Länk3 Länk3

...även om jag tittar på sidan med mobilen eller med Lynx? I så fall blir det ungefär

<table>
 <thead>
  <tr>
   <th scope="col">Rubrik 1</th>
   <th scope="col">Rubrik 2</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><a href="#">Länk 1</a></td>
   <td><a href="#">Länk 1</a></td>
  </tr>
  <tr>
   <td><a href="#">Länk 2</a></td>
   <td><a href="#">Länk 2</a></td>
  </tr>
  <tr>
   <td><a href="#">Länk 3</a></td>
   <td><a href="#">Länk 3</a></td>
  </tr>
 </tbody>
</table>

...annars kan man kanske göra ungefär såhär:

<div>
 <h2>Rubrik 1</h2>
 <ul>
  <li><a href="#">Länk 1</a></li>
  <li><a href="#">Länk 2</a></li>
  <li><a href="#">Länk 3</a></li>
 </ul>
</div>
<div>
 <h2>Rubrik 2</h2>
 <ul>
  <li><a href="#">Länk 1</a></li>
  <li><a href="#">Länk 2</a></li>
  <li><a href="#">Länk 3</a></li>
 </ul>
</div>

div { float:left; width:49.9%; }

Det beror på hur du vill beskriva innehållet; som en tabell eller som två listor?

zcorpan skrev:

Det beror på hur du vill beskriva innehållet; som en tabell eller som två listor?

Vad menar du?

Tänkte mig som jag skrev innan, två listor bredvid varandra, den ena som beskriver vad det är för något jag fyller i, den andra, där man fyller i. :OO :)

Aha, okej. Grejen är den att det kan variera hur många listor det är bredvid varandra. Så det blir kanske lite knepigt om man har en tabell? Iom att det inte alltid kommer vara en <tr> där som gör så att det blir en ny rad.

Om man använder div { float:left; width:49.9%; }, sedan ifall det är kanske tre st bredvid varandra och de tar upp all den bredd av diven de befinner sig i, kommer den fjärde diven hamna på en ny rad? Eller kan det bli nått fel i någon webbläsare så att det skiter sig så att den hamnar på något oplanerat ställe?

Jag antog i mitt exempel att du ville ha två kolumner, men om du vill ha tre kolumner kan du enkelt ändra bredden till 33% ;)

jaja, det fattade jag med :P Men det var det ifall det kan bli nått fel i någon webbläsare, att diven lägger sig utanför eller nått, men det kanske inte blir så :)