Hvis du bruker tabeller for sideoppsett (et nei-nei i XHTML), er det sannsynlig at du vil oppleve det stygge tillegget av ekstra plass i layoutene dine. For å løse dette problemet, må du sjekke både HTML-tabelldefinisjonen og detaljene til et hvilket som helst styrende stilark.
HTML-tabelldefinisjon
HTML stikkord for tabeller som standard ikke kontrollerer for noen avstandskrav. Bekreft tre ting om bord tag i HTML-dokumentet:
- Har tabellen din cellpadding-attributtet satt til 0?
cellpadding = "0"
- Har tabellen celleavstandsattributtet satt til 0?
cellspacing = "0"
- Er det noen mellomrom før eller etter innholdet ditt og tabellens koder?
Nummer 3 er kickeren. Mange HTML-redaktører liker å ha koden helt fordelt, for å gjøre det enkelt å lese. Men mange nettlesere tolker disse fanene, mellomrommene og vognreturene som ønsket ekstra plass i bordene dine. Bli kvitt det store området rundt kodene dine, så får du skarpere tabeller.
Stilark
Det kan imidlertid ikke være HTML-en som er av. Kaskaderende stilark
kontroller noen visningsattributter for tabeller, og avhengig av siden, har du kanskje ikke med vilje lagt til bordspesifikk CSS i utgangspunktet.Skann den styrende CSS-filen for noen av følgende verdier i bord, th, eller tdegenskaper og juster etter behov:
- grense: Spesifiserer attributtene til en tabell eller cellegrense
- grense-kollaps: Behandler tilstøtende grenser som en, for å unngå duplisering av kantbredder
- polstring: Tilbyr tom plass, i piksler, rundt hver celle
- tekstjustering: Bestemmer justering av tekst inne i cellen
- grense-avstand: Angir avstand mellom celler, i piksler
Alternativer
Selv om du fremdeles kan bruke HTML-tabeller (standarden er veletablert og universelt støttet i dagens nettlesere), mest moderne responsive webdesign bruker cascading stilark for å plassere elementer på en side. Tabeller er fortsatt fornuftige for det opprinnelige tiltenkte formålet med å vise tabelldata, men for å organisere layout og innhold på en side, er det mye bedre å bruke CSS-layout i stedet.