Notifikationer

Markér alle som læst Log ud

babyworm Nybegynder

07. april 2005 - 08:41 Der er 19 kommentarer og
1 løsning

ting i midten af skærmen

Hej.

Jeg er igang med at lave en hjemmeside i xHTML 1.0 Traditional, og skal have sat min tabel i midten af skærmen.

Har fået lavet det på denne måde:
<div style="width:100%;text-align:center;">
<table border="0" cellpadding="0" cellspacing="0" style="width:600px;">
<tr>
<td>Tekst</td>
</tr>
</table>
</div>

Dette virker kun i Internet Explorer, og jeg skal have det til at virke i de andre browsere også. Hvordan kan jeg få lavet det ?

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 08:45 #1

Horisontalt:
margin: 0 auto;
Verticalt:

body,html
{
height: 100%;
}

Og så lav en ydre table med style="height: 100%;" , så vil indholder centeres.

Synes godt om

babyworm Nybegynder

07. april 2005 - 08:46 #2

I xHTML 1.0 height:100%; fjernet

Synes godt om

babyworm Nybegynder

07. april 2005 - 08:47 #3

Men skal ikke centres i midten af skærmen på den måde..

Det skal bare være en text-align:center men virker ikke

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 08:49 #4

"I xHTML 1.0 height:100%; fjernet" <- nej

margin: 0 auto; bruges til horisontal centering, text-align:center bruges til et centere tekst, men kan sættes på body {} elementet i CSS, for at det virker tilbage til IE4

Synes godt om

babyworm Nybegynder

07. april 2005 - 08:52 #5

hvis jeg sætter text-align:center; i mit body tag, virker det hverken i IE eller FireFox

og i xHTML er jeg overbevist om at height i % er fjernet :)

Synes godt om

Slettet bruger

07. april 2005 - 08:54 #6

Kunne du ikke bare bruge
<center>
<table border ......>
..
</table>
</center>

?

Synes godt om

babyworm Nybegynder

07. april 2005 - 08:54 #7

hvis jeg sætter i margin: 0 auto; i mit body tag virker det stadig ikke...

Synes godt om

babyworm Nybegynder

07. april 2005 - 08:55 #8

center virker heller ikke

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 08:58 #9

babyworm

Kom med din kode så, jeg ved altså hvad jeg snakker om.

www.thedeathart.dk er centeret på begge led, helt tilbage til IE 4

Synes godt om

Slettet bruger

07. april 2005 - 08:59 #10

Følgende virker i min Firefox 1.0.2:

<center>
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td>Tekst</td>
</tr>
</table>
</center>

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 08:59 #11

<center> er depracted, og bør ikke bruges.

margin: 0 auto; skal self være på den box du vil centere, og der skal være en width på ellers virker det ikke.

text-align: center; i body tagget er udlukket til IE4/IE5

Synes godt om

babyworm Nybegynder

07. april 2005 - 09:00 #12

<!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" xml:lang="da" lang="da">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="imagetoolbar" content="false" />
<link rel="Stylesheet" rev="Stylesheet" href="stylesheets/standard.css" type="text/css" />
<link rel="Stylesheet" rev="Stylesheet" href="stylesheets/standard_txt.css" type="text/css" />
</head>

<body>
<div style="width:100%;text-align:center;">
<table border="0" cellpadding="0" cellspacing="0" id="main">
<tr>
<td id="top"></td>
</tr>
<tr>
<td id="loginUser">Patrick Nielsen</td>
</tr>
<tr>
<td id="spacer"></td>
</tr>
<tr>
<td id="menu">
<div style="position:relative;float:left;left:0px;">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="#">forside</a></td>
<td class="menSpc">-</td>
<td><a href="#">sider</a></td>
<td class="menSpc">-</td>
<td><a href="#">test</a></td>
<td class="menSpc">-</td>
<td><a href="#">moduler</a></td>
<td class="menSpc">-</td>
<td><a href="#">filer</a></td>
<td class="menSpc">-</td>
<td><a href="#">bruger</a></td>
<td class="menSpc">-</td>
<td><a href="#">admin</a></td>
</tr>
</table>
</div>
<div style="position:relative;float:right;right:0px;">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="#">profil</a></td>
<td class="menSpc">-</td>
<td><a href="#">log ud</a></td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td id="submenu">
Du er her: moduler » oversigt
</td>
</tr>
<tr>
<td id="contentarea"><br /><br /><br />br />
<table border="0" style="width:100%;">
<tr style="height:10px;">
<td style="width:20px;" class="tblTop"> </td>
<td class="tblTop">Name</td>
<td style="width:50px;" class="tblTop">Jobno.</td>
<td style="width:80px;" class="tblTop">Size</td>
<td style="width:100px;" class="tblTop">Uploaded</td>
<td style="width:60px;" class="tblTop">User</td>
<td style="width:20px;" class="tblTop"> </td>
<td style="width:20px;" class="tblTop"> </td>
<td style="width:20px;" class="tblTop"> </td>
</tr>
<tr class="spg">
<td></td>
<td>tekst</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr class="ans">
<td></td>
<td>tekst</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr class="spg">
<td></td>
<td>tekst</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr class="ans">
<td></td>
<td>tekst</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr class="spg">
<td></td>
<td>tekst</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
<tr>
<td id="bottom"></td>
</tr>
</table>
</div>
</body>
</html>

Synes godt om

babyworm Nybegynder

07. april 2005 - 09:00 #13

body {
background-image:url('../images/bg.jpg');
margin:0px;
padding:0px;
font-family:Verdana,Tahoma,Arial,Sans-serif;
font-size:10px;
}

a {
font-weight:bold;
color:#2F669B;
text-decoration:none;
}

a:hover {
font-weight:bold;
color:#2F669B;
text-decoration:underline;
}

#main {
width:850px;
background-color:#F7F9FA;
border: 1px solid #2F669B;
border-top:0px;
text-align:left;
}

#submenu {
height:15px;
color:#668BA1;
padding-left:15px;
}

#top {
height:115px;
background-color:#F7F9FA;
padding-left:3px;
}

#loginUser {
height:10px;
text-align:right;
font-size:10px;
padding-right:15px;
color:#668BA1;
}

#spacer {
height:4px;
background-color:#6385A0;
}

#contentarea {
padding:15px;
vertical-align:top;
}

#menu {
height:25px;
background-color:#DEE7EC;
text-align:center;
font-weight:bold;
color:#2F669B;
padding-left:15px;
padding-right:15px;
}

#bottom {
height:10px;
background-color:#6385A0;
}

.tblSpace {
width:2px;
background-color:#ffffff;
}

.tblTop {
background-color:#6385A0;
padding:2px;
font-weight:bold;
color:#ffffff;
}

.spg {
height:15px;
background-color:#DEE7EC;
}

.ans {
height:15px;
background-color:#ffffff;
}

.menSpc {
text-align:center;
width:25px;
}

Synes godt om

babyworm Nybegynder

07. april 2005 - 09:02 #14

KEwl.. så fik jeg løst det...

satte margin: 0 auto; på min #main

Lægger du lige svar ?= :D

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 09:04 #15

Første <div> skal ændres til:

<div style="width:850px; margin: 0 auto; text-align: left;">

og body i css til:

body {
background-image:url('../images/bg.jpg');
margin:0px;
padding:0px;
font-family:Verdana,Tahoma,Arial,Sans-serif;
font-size:10px;
text-align: center;
}

så burde det være horisontal centeret tilbage til IE4

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 09:05 #16

nej tak, samler ikke på points.

Synes godt om

babyworm Nybegynder

07. april 2005 - 09:07 #17

Alister_crowley: Tuuuuuusssinde tak.. er der ikke noget jeg kan hjælpe dig med eller gøre for dig ?

Synes godt om

alister_crowley Nybegynder

07. april 2005 - 09:14 #18

næ ikke lige :)

Synes godt om

olebole Juniormester

07. april 2005 - 15:09 #19

<ole>

- og da jeg går udfra, du skriver XHTML, fordi du fejlagtigt tror, det er bedre end HTML, bør du nok læse de her to:
http://www.eksperten.dk/artikler/537
http://www.eksperten.dk/artikler/538

Det forholder sig nemlig stik modsat :)

/mvh
</bole>

Synes godt om

babyworm Nybegynder

15. august 2005 - 13:30 #20

Lukket

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

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

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