Hvis du bruger tabeller til sidelayout (et nej-nej i XHTML), det er sandsynligt, at du vil opleve den grimme tilføjelse af ekstra plads i dine layouts. For at løse dette problem skal du kontrollere både din HTML-tabeldefinition og specifikationerne for ethvert styrende stilark.
HTML-tabel Definition
HTML tag for tabeller kontrollerer som standard ikke nogle krav til afstand. Bekræft tre ting om bord tag i dit HTML-dokument:
- Har din tabel cellepadding-attributten sat til 0?
cellpadding = "0"
- Har din tabel celleafstandsattributten sat til 0?
cellspacing = "0"
- Er der nogen mellemrum før eller efter dit indhold og tabellens tags?
Nummer 3 er kickeren. Mange HTML-redaktører gerne have koden alle adskilt, for at gøre det let at læse. Men mange browsere fortolker disse faner, mellemrum og vognretur som ønsket ekstra plads inde i dine tabeller. Slip af med det hvide område, der omgiver dine tags, og du får skarpere tabeller.
Stilark
Det er dog muligvis ikke HTML, der er slået fra. Kaskaderende stilark
kontrollerer nogle visningsattributter for tabeller, og afhængigt af siden har du måske eller måske ikke bevidst tilføjet tabel-specifik CSS i første omgang.Scan den styrende CSS-fil for en af følgende værdier inden i bord, th, eller tdegenskaber og juster efter behov:
- grænse: Angiver attributterne for en tabel eller en cellekant
- grænsekollaps: Behandler tilstødende grænser som en, for at undgå at duplikere kantbredder
- polstring: Tilbyder blank plads i pixels omkring hver celle
- tekstjustering: Bestemmer justering af tekst inden i cellen
- grænseafstand: Indstiller afstanden mellem celler i pixels
Alternativer
Selvom du stadig kan bruge HTML-tabeller (standarden er veletableret og understøttes universelt i dag browsere), mest moderne responsive webdesign bruger kaskadeformede ark til at placere elementer på en side. Tabeller giver stadig mening for deres oprindelige tilsigtede formål at vise tabeldata, men for at organisere layoutet og indholdet på en side er det meget bedre at bruge CSS-layout i stedet.