Centrera med CSS
Vill du centrera din webbsida med innehållet så gör man detta enkelt med en autogenerering av vänster och högermarginalerna. Det finns olika sätt att göra detta på, men det absolut enklaste i detta fall är att skriva in kodraden nedan i din stilmall.
Ex.1
(CSS)
#wrapper{
width:960px;
margin:0 auto;
min-height:100%;
}
Och så här ser HTML koden ut för att implementera allt i
ett HTML-dokument:
**FÖRKLARING
#wrapper **Ett s k DIV- element som är separerat från BODY -taggen och som omfamnar delar av eller hela din webbsida och dess innehåll. Allt innehåll bör ligga inom en vad vi kan kalla för "en behållare". Denna behållare kallas inom branschen för en "Wrapper" eller "Container". Begreppet "wrapper"- menas alltså att något är inslaget i en behållare(wrapper), eller att man slår in något, något är omfamnat eller man omfamnar(container) något innehåll.
min-height:100% Med min-height: satt till 100% sätter du automatiskt minsta höjden på hela webbplatsen och man vill ju oftast att en sida ska täcka hela sidan från toppen till botten
margin: auto 0; Sätter du margin -värdet till auto 0 eller till 0 auto så får du samma resultat, du centrerar hela sidans (960px)-innehåll i förhållande till skärmstorlek och angiven storlek i width. Sätter du däremot width -värdet till 100% så finns det givetvis inget att centrera då 100% som width -värde kommer att täcka hela skärmen från kant till kant.
Daniel, Värd: Datorn i Fokus. Medarbetare: Webbprogrammering iFokus.
