Avatar billede henrik_r Nybegynder
28. juni 2004 - 15:56 Der er 8 kommentarer

Er dette den korrekte måde at lave det på?

Hej, er ved at lære at bruge CSS istedet for tables til at designe sider med..

Mit spørgsmål er så flg. Jeg laver ofte sider i nogenlunde dette format, er dette her så den rigtige måde at lave det på?

<--------------CSS.CSS------------->
body {
    text-align: center;
}
#main {
    width: 760px;
    background-color: blue;
    height: 500px;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    border: solid black 1px;
}
#kasse {
    background-color: white;
    height: 100px;
}
#menu {
    float: left;
    width: 150px;
}
#cont {
    float: right;
    text-align: left;
    width:610px;
}

<--------SLUT CSS---------------->


<----------------index.htm--------------->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da">
<head>
<title>MyDESIGN</title>
<link rel="stylesheet" type="text/css" href="css.css" />
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
</head>

<body><div id="main">

<div id="kasse">Her er kassen</div>
<div id="cont">Her kommer alt det jeg gerne vil skrive!!!!</div>
<div id="menu">Punkt1<br />Punkt 2<br />Punkt 3</div>

</div></body>
</html>

<----------SLUT HTML------------>

Håber der er en ekspert herinde, der kan give mig et godt svar :)

På forhånd tak..
M.v.h.
Henrik
Avatar billede roenving Novice
28. juni 2004 - 16:02 #1
En udmærket måde at gøre det på, da du så både tager højde for, at IE fejlagtigt text-aligner block-level elementer, men til gengæld ikke understøtter margin:auto ...
Avatar billede roenving Novice
28. juni 2004 - 16:03 #2
Har du da problemer med det ?-)
Avatar billede henrik_r Nybegynder
28. juni 2004 - 16:06 #3
Hehe.. Sikke en masse jeg har taget højde for uden at ane det :)

Har ikke rigtig nogle problemer - skulle bare høre om det var den mest korrekte måde at gøre det på.

Lige et tillægsspørgsmål..

Hvis jeg vil have den tekst der: "Her er kassen" til at stå nederest i højre hjørne kan man gøre det? Har text-align: right; lige nu, men kan man gøre noget med bottom som valign="bottom" i en td? Håber du forstår.

Tak for det superhurtige svar...
Avatar billede gil-galad Nybegynder
28. juni 2004 - 16:55 #4
Avatar billede roenving Novice
28. juni 2004 - 17:33 #5
#kasse {
    background-color: white;
    height: 100px;
    position:absolute;
    bottom:0px;
}
Avatar billede henrik_r Nybegynder
28. juni 2004 - 18:38 #6
Tak for svaret, men ikke det jeg søger...

Hvis vi har en #kasse, skal det være sådan her:

----------------------div med id=kasse--------------
I                                                  I
I                                                  I
I                                                  I
I                                                  I
I                              Menuen skal stå her I
-----------------------------------------------------

Med en tabel kunne man gøre det ved at give td'en disse att.
< td align=right valign=bottom >

Kan jeg ikke gøre noget lignende med en div?

M.v.h.

Henrik
Avatar billede henrik_r Nybegynder
28. juni 2004 - 18:39 #7
Hmm.. Min kasse blev ikke lige så pæn.. Men håber du forstår den :)
Avatar billede roenving Novice
28. juni 2004 - 18:55 #8
#kasse {
    background-color: white;
    height: 100px;
    position:relative;
}
#inderkasse{
    position:absolute;
    bottom:0px;
    right:0px;
}

<div id="kasse">
<div id="inderkasse">
Her er kassen</div></div>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester