Avatar billede alex15 Nybegynder
28. februar 2007 - 13:06 Der er 15 kommentarer og
1 løsning

Centrer hjemmeside

Hej eksperter

Jeg er begyndt og lave min hjemmeside, og har lavet en lille css fil, og ellers er den første side lavet i html

Men har lige fundet ud af at jeg gerne vil centrere hjemmesiden, hvordan kan jeg gøre det? Eller hvad skal jeg rette i mine koder for at den bliver centeret?
Avatar billede alex15 Nybegynder
28. februar 2007 - 13:06 #1
CSS filen:

#Layer1 {
    position:absolute;
    width:985px;
    height:620px;
    z-index:1;
    left: 27px;
    top: 25px;
}
#Layer2 {
    position:absolute;
    width:621px;
    height:75px;
    z-index:1;
    left: 119px;
    top: 78px;
}
#Layer3 {
    position:absolute;
    width:507px;
    height:275px;
    z-index:2;
    left: 119px;
    top: 200px;
}
#Layer4 {
    position:absolute;
    width:106px;
    height:275px;
    z-index:3;
    left: 634px;
    top: 200px;
}
#Layer5 {
    position:absolute;
    width:621px;
    height:100px;
    z-index:4;
    left: 119px;
    top: 483px;
}
#Layer6 {
    position:absolute;
    width:113px;
    height:62px;
    z-index:5;
    left: 829px;
    top: 430px;
}
#Layer7 {
    position:absolute;
    width:507px;
    height:25px;
    z-index:6;
    left: 119px;
    top: 170px;
}
#Layer8 {
    position:absolute;
    width:622px;
    height:22px;
    z-index:7;
    left: 119px;
    top: 589px;
}
body {
    background-color: #000000;
}
Avatar billede alex15 Nybegynder
28. februar 2007 - 13:06 #2
HTML filen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>
<link rel="stylesheet" type="text/css" href="skabelon.css">
<style type="text/css">
</style>
</head>

<body>
<div id="Layer8"> <div align="right">

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/knap-nede-om_ccc1.jpg"
alt="Om CCC" name="bil1" onmouseover="this.src='billeder/knap/knap-nede-om_ccc2.jpg'"
onmouseout="this.src='billeder/knap/knap-nede-om_ccc1.jpg'" width="55" height="20"></A>

<img src="billeder/knap/Knap-nede-mellemrum.jpg" width="4" height="20" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/knap-nede-kontakt_os1.jpg"
alt="Kontakt os" name="bil1" onmouseover="this.src='billeder/knap/knap-nede-kontakt_os2.jpg'"
onmouseout="this.src='billeder/knap/knap-nede-kontakt_os1.jpg'" width="72" height="20"></A>

<img src="billeder/knap/Knap-nede-mellemrum.jpg" width="4" height="20" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/knap-nede-login1.jpg"
alt="Login" name="bil1" onmouseover="this.src='billeder/knap/knap-nede-login2.jpg'"
onmouseout="this.src='billeder/knap/knap-nede-login1.jpg'" width="37" height="20"></A>

</div></div>
<div id="Layer2"><A HREF="skabelon.html"><img border="0" src="billeder/banner.jpg" alt="" width="621" height="75" /></div>
<div id="Layer3"><img src="billeder/tekstboks.jpg" alt="" width="507" height="275" /></div>
<div id="Layer4"><img src="billeder/billedboks.jpg" alt="" width="106" height="275" /></div>
<div id="Layer5"><img src="billeder/banner/Under/porsche-turbo1.jpg" width="622" height="100" /></div>
<div id="Layer7">

<p><A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/Knap-forside1.jpg"
alt="Forside" name="bil1" onmouseover="this.src='billeder/knap/Knap-forside2.jpg'"
onmouseout="this.src='billeder/knap/Knap-forside1.jpg'" width="61" height="25"></A>

<img src="billeder/knap/Knap-mellemrum.jpg" width="12" height="25" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/Knap-biler1.jpg"
alt="biler" name="bil1" onmouseover="this.src='billeder/knap/Knap-biler2.jpg'"
onmouseout="this.src='billeder/knap/Knap-biler1.jpg'" width="41" height="25"></A>

<img src="billeder/knap/Knap-mellemrum.jpg" width="12" height="25" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/Knap-priser1.jpg"
alt="Priser" name="bil1" onmouseover="this.src='billeder/knap/Knap-priser2.jpg'"
onmouseout="this.src='billeder/knap/Knap-priser1.jpg'" width="51" height="25"></A>

<img src="billeder/knap/Knap-mellemrum.jpg" width="12" height="25" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/Knap-arrangementer1.jpg"
alt="Arrangementer" name="bil1" onmouseover="this.src='billeder/knap/Knap-arrangementer2.jpg'"
onmouseout="this.src='billeder/knap/Knap-arrangementer1.jpg'" width="128" height="25"></A>

<img src="billeder/knap/Knap-mellemrum.jpg" width="12" height="25" />

<A HREF="billeder/alex.jpg"><img border="0" src="billeder/knap/Knap-download1.jpg"
alt="Download" name="bil1" onmouseover="this.src='billeder/knap/Knap-download2.jpg'"
onmouseout="this.src='billeder/knap/Knap-download1.jpg'" width="81" height="25"></A>



</p>
</div>

</body>
</html>
Avatar billede scorpe Nybegynder
28. februar 2007 - 19:01 #3
Det der skal centreres skal du vel sætte ind i <div align="center">Tekst her</div>
Avatar billede alex15 Nybegynder
28. februar 2007 - 23:20 #4
du får de 150 point for at gøre det for mig..! synes virkelig jeg er forvirret lige nu :S
Avatar billede steen_hansen Forsker
28. februar 2007 - 23:26 #5
<div style="width: 600px; text-align: center; vertical-align: middle; margin: 0px auto;"> (flere eksempler i samme DIV), ikke <div align="center"> :)
Avatar billede scorpe Nybegynder
01. marts 2007 - 13:07 #6
Okay, du gjorde det i css ... :P
Avatar billede roenving Novice
02. marts 2007 - 14:02 #7
-- men text-align _må_ ikke virke på block-level elementer, så det skal for hoved-diven gøres med marginen !-)
Avatar billede alex15 Nybegynder
03. marts 2007 - 21:20 #8
Ja okay.. Prøver jeg lige engang i morgen så..!
Avatar billede alex15 Nybegynder
05. marts 2007 - 08:25 #9
Men hvor skal jeg præcis indsætte det henne? i min css altså? kan ikke rigtig få det til at fungere?
Avatar billede alex15 Nybegynder
05. marts 2007 - 09:01 #10
Er det ikke muligt at jeg evt kan sende jer hjemmesiden (fylder 0,5 mb), for kan ikke få den til at virke?!? :S
Avatar billede alex15 Nybegynder
05. marts 2007 - 09:31 #11
Lige nu ser hjemmesiden sådan her ud..

http://www.fluii.dk/pic.asp?id=1716

Men kan ikke få selve hjemmesiden til at stå i midten..!
Avatar billede roenving Novice
05. marts 2007 - 16:58 #12
-- et meget simpelt eksempel, som du så kan spørge til:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Sådan centrerer man vha css</title>
<style type="text/css">
html,body{height:100%;margin:0px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
#site{position:relative;width:864px;margin:0 auto;height:100%;text-align:center;font-size:24px;background-color:#ffd;}
</style>
</head>
<body>
<div id="site">
  Dette er selve sidens krop !-)
  <div style="position:absolute;width:264px;height:200px;top:200px;left:600px;font-size:12px;border:1px dotted red;">Forskellige steder kan du så placere ting</div>
  <div style="position:absolute;width:600px;height:200px;top:500px;left:0;font-size:12px;border:1px dotted red;">Forskellige steder kan du så placere ting</div>
</div>

</body>

</html>
Avatar billede alex15 Nybegynder
05. marts 2007 - 19:16 #13
Uha..! ja okay, det vil jeg lige sidde og kigge lidt på i aften, eller en af de kommende dage, så melder jeg lige tilbage hvordan det går.. :o)
Avatar billede alex15 Nybegynder
05. marts 2007 - 21:31 #14
Men vi er engine om at det skal sættes ind i toppen af mit html dokument ikke? altså der er intet af det som skal ind i css filen vel?
Avatar billede alex15 Nybegynder
05. marts 2007 - 23:47 #15
Sådan, så fik jeg det hele til at virke.. jeg siger mange tak for hjælpen, så hvis i gider give nogle svar. så i kan få nogle point, så ville det være perfekt :o)
Avatar billede alex15 Nybegynder
24. oktober 2007 - 15:31 #16
Lukket
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