Indlæs andet indhold på denne side:
Som hjemmesideejer vil man gerne have sine sider til at tage sig flot ud. Og man kan bruge lang tid på at få tekst og billeder til at gå op i en højere harmonisk enhed - indtil man ser siden i en anden skærmopløsning eller (især) en anden størrelse browservindue end den, man nu engang har arbejdet ved, da siderne blev lavet.
Men hvis man nu putter sidens indhold ind i en boks med fast bredde og lader denne boks flyde frit i vinduet, med margener som automatisk tilpasser sig størrelsen på det åbne browservindue, så er man ude over problemet.
Siden er opdateret 12. 12. 2005
Sidens bredde og fontstørrelser kan defineres med værdien em, det har den effekt, at hvis brugeren ændrer på den viste fontstørrelse, ændres sidens bredde tilsvarende og sidens design er stort set uændret:
body{
background:url(bg.gif);
color:black;
margin:0px;
text-align:center;
}
#indhold{
width:40em;
margin-top:2em;
margin-bottom:2em;
margin-left:auto;
margin-right:auto;
position:relative;
padding: 1em;
text-align:left;
color:black;
background:#eef;
border:solid 1px #669;
}
Eneste forskel fra første eksempel er, at bredden er defineret som et multiplum af bredden på bogstavet m i stedet for en pixelfast bredde.
Her har vi igen defineret text-align:center i body, hvorfor vi må tage samme forholdsregel i #indhold som i første eksempel.
I html laves det på samme måde som vist i første eksempel.
Desværre er Hjemmesideskolens sidedesign ikke så velegnet til denne demo, det går især galt i Opera og IE. Jeg har derfor til denne demo lavet en 'flad side'.