CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

krk Nybegynder

28. juli 2007 - 11:49 Der er 10 kommentarer og
1 løsning

Hvorfor centreres siden ikke i IE

Hvorfor bliver det ikke centreret?
Min kode ser sådan ud
css:
body{background:#000;overflow:hidden;}
#page{margin: 0 auto;width:860px;background:pink;height:20px;}

htnl:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>AddOnAx</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="xxx2.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="page">

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

Synes godt om

goya Novice

28. juli 2007 - 12:22 #1

du kan centrere et div tag på denne her måde:
#maincontainer
{
position:absolute;
width:900px;
height:2183px;
z-index:1;
top: 0px;
background-color: #000000;
left: 50%;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-left: -450px;
visibility: visible;
}
hilsen
goya

Synes godt om

krk Nybegynder

28. juli 2007 - 12:55 #2

Det virker som rimeligt meget kode, men et okay forslag. Jeg har ikke testet om det virker fordi jeg har endelig selv fundet ud af hvad der er forkert.
Der skal stå:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Er der nogen der kan forklare hvad den sidste sætning ("http://www.w3.org/TR/html4/loose.dtd") betyder eller hvorfor den skal med?

Synes godt om

robn Nybegynder

28. juli 2007 - 14:56 #3

den skal med, for ellers går din browser i "Quirks" mode, den prøver at gætte og accepterer tidligere standard, som efter html 4.01 er forældet,

http://www.alistapart.com/stories/doctype/

Du kan kun regne med, at html 4.01s standard bliver overholdt, hvis du skriver din doctype helt ud.

Synes godt om

goya Novice

28. juli 2007 - 16:33 #4

det her kode er ikke ret meget, det centrerer et,
div id=maincontainer (eksempel)
det der er vigtigt er de her linier

#maincontainer
{
position:absolute;
width:900px;
margin-left: -450px;
visibility: visible;
}

:-)

Synes godt om

goya Novice

28. juli 2007 - 16:36 #5

sorry:
#maincontainer
{
position:absolute;
width:900px;
height:2183px;
z-index:1;
top: 0px;
left: 50%;
margin-left: -450px;

}

hvor margen left har en minus værdi der svarer til halvdelen af dit <Div>
plus de left: 50%

:-)

Synes godt om

apo Praktikant

28. juli 2007 - 16:51 #6

Svaret er simpelt: Div'et 'page' centreres ikke i IE fordi, du mangler linket i din DOCTYPE.

Uden linket i sidens DOCTYPE, virker 'hacket' margin:0 auto; ikke i IE - det samme gælder for det meste andet CSS.

Prøv denne i stedet:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>AddOnAx</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="xxx2.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="page">

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

Synes godt om

apo Praktikant

28. juli 2007 - 16:52 #7

Jeg overså at andre havde afgivet det korrekte svar. Se blot bort fra mit svar :o)

Synes godt om

krk Nybegynder

28. juli 2007 - 17:12 #8

ikke for at være på tværs eller noget, men i forhold til "#page{margin: 0 auto;width:860px;}" så er det da en masse ekstra linier :-)
Men smid bare et svar for jeg kan godt se at det også virker

Synes godt om

goya Novice

28. juli 2007 - 18:28 #9

hmmm, der er vel flere måder at gøre det på, men på min kan jeg trække et div ind i hoved laget og det forholder sig relativt til hovedlaget, så alle mine div bliver inde i hoved laget, vel jeg er ikke nofen nørd, jeg bruger bare hvad der virker i dreamweaver :-)
du kan se det her http://www.eksperten.dk/spm/789306 hvor jeg selv har oprettet et spørgsmål ....

Synes godt om

olebole Juniormester

29. juli 2007 - 01:32 #10

<ole>

goya >> Hvad der virker, er langtfra nødvendigvis god kode ... og det er din absolut ikke. 'margin: 0 auto' er den eneste logiske måde at gøre det på - og den måde, der giver mening i forhold til CSS.

Absolut positionerede elementer er et helvede, man bør holde sig langt væk fra. Det gør kun koden langt vanskeligere at vedligeholde - og besværliggør anbringelsen af elementer (som det f.eks. altid har været tilfældet i Visual Studio og andre miljøer, der udelukkende arbejder med absolut positionering).
Absolut positionering kan være udmærket til enkelte løsninger (f.eks. elementer i relativt positionerede elementer), men det bør ikke bruges generelt ... dét er god CSS ;o)

/mvh
</bole>

Synes godt om

krk Nybegynder

19. august 2007 - 17:41 #11

lukker

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51
Link fra form input Af jnrmgs i HTML	9	19/09/202319:10	23/09/202313:11
includere i HTML Af slein55 i HTML	3	15/09/202313:47	16/09/202309:40

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS