HTML: Centreret div

Måske:

<div style="width:300px;height:300px;background-color:#000;">
    <div style="width:200px;height:200px;margin:auto;position:absolute;top:50px;background-color:#e0e0e0;"></div>
</div>

Hrm, nok nærmere:

<div style="width:300px;height:300px;background-color:#000;position:relative;">
    <div style="width:200px;height:200px;margin:0 auto;position:relative;top:50px;background-color:#e0e0e0;">&nbsp;</div>
</div>

Doh! Ja, relativt self. :)

-- det vigtige var at containeren fik en position !-)

Hvad med:
<div align="center">

deprecated kode de sidste 10 år ,-(

align="center" var noget jeg så da jeg lige skulle se hvordan eksperten var centreret.

Udpluk af ekspertens html:
<div align="center"><table id="table_main" style="width: 890px;"><tr><td rowspan="7" class="margin_white"><span class="spacer"></span></td><td colspan="2" class="margin_white"><span class="spacer"></span></td><td rowspan="7" class="margin_white"><span class="spacer"></span></td></tr><tr><td rowspan="2" style="width: 110px; vertical-align: top;"><a href="/"><img src="/img/elogo.png" alt="" class="elogo" /></a></td><td class="banner-top"><!--JavaScript Tag // Tag for network 277: IDG Online - Denmark // Website: Eksperten // Page: Default // Placement: Default 728x90 (72962) // created at: Jan 23, 2007 4:34:10 PM-->
<script language="javascript"><!--
document.write('<scr'+'ipt language="javascript1.1" src="http://adserver.adtech.de/addyn|3.0|277|72962|0|225|ADTECH;loc=100;target=_blank;grp=[group];misc='+new Date().getTime()+'"></scri'+'pt>');
//-->
</script><noscript><a href="http://adserver.adtech.de/adlink|3.0|277|72962|0|225|ADTECH;loc=300;grp=[group]" target="_blank"><img src="http://adserver.adtech.de/adserv|3.0|277|72962|0|225|ADTECH;loc=300;grp=[group]" border="0" width="728" height="90"></a></noscript>
<!-- End of JavaScript Tag --></td></tr><tr><td style="text-align: center; height: 16px;"><ul id="tabmenu"><li><a href="/" class="set">Spørgsmål &amp; Svar</a></li><li><a href="/artikler/">Artikler</a></li><li><a href="/priser/">Priser</a></li><li><a href="/job/cv/">C.V.</a></li><li><a href="http://www.cafeshops.com/eksperten" class="shop">Butikken</a></li><li><a href="http://www.idg.dk/" class="idg">IDG</a></li></ul></td></tr><tr><td colspan="2"><form action="/list.phtml" method="get" class="searchbar"><input type="hidden" name="method" value="and" /><input type="hidden" name="excerpt_on" value="1" /><table style="width: 100%;"><tr><td class="menu_td" style="border-left: 1px solid #000000;"><ilayer id="layerMenu"><div id="divMenu"><img src="/img/t.gif" alt="" class="menu_img" /></div></ilayer></td><td class="menu_td" style="width: 128px;"><input type="text" name="find" value="S&oslash;g" onclick="this.value='';" maxlength="100" accesskey="q" class="searchbar_input" /></td><td class="menu_td" style="width: 5px;"><span class="spacer">&nbsp;</span></td><td class="menu_td" style="width: 11px;"><input src="/img/submit_arrow.gif" type="image" alt="Search" class="searchicon" /></td><td class="menu_td" style="width: 5px; border-right: 1px solid #000000;"><span class="spacer">&nbsp;</span></td></tr></table></form></td></tr><tr><td colspan="2" class="margin_white"><span class="spacer"></span></td></tr><tr><td colspan="2" style="width: 890px;"><form id="fexp" name="fexp" action="/respons.php" method="post"><input type="hidden" name="qid" value="829345" /><input type="hidden" name="impid" value="0" /><input type="hidden" name="rselected" value="" /><table style="width: 100%;table-layout: fixed; overflow: hidden;"><tr valign="top"><td id="box_left" class="boxes" style="width: 150px;"><div id="b08" class="box" style="background-color:#71b8db;"><div class="box_title" style="background-color:#006699;"><img id="b08i" src="/img/arrow-down.gif" class="box_arrow" alt="Minimer / Maksimer" title="Minimer / Maksimer" onclick="box_click('b08');" />&nbsp;Dine data</div><div id="b08c" class="box_content"><table><tr><td style="width:56px;">Navn</td><td style="text-align:right;"><a href="/konto.phtml">jeppe999</a></td></tr><tr><td>Point</td><td style="text-align:right;">530</td></tr><tr><td>Point ude</td><td style="text-align:right;">0</td></tr><tr><td>Placering</td><td style="text-align:right;">11.334</td></tr></table></div></div><div id="b09" class="box" style="background-color:#71b8db;"><div class="box_title" style="background-color:#006699;"><img id="b09i" src="/img/arrow-down.gif" class="box_arrow" alt="Minimer / Maksimer" title="Minimer / Maksimer" onclick="box_click('b09');" />&nbsp;Sp&oslash;rgsm&aring;l data</div><div id="b09c" class="box_content"><table><tr style="vertical-align:top;"><td>Kategori</td><td title="Programmering :: (D)HTML ::">(D)HTML</td></tr><tr><td>Point</td><td>15</td></tr><tr><td>Oprettet</td><td>27/04 2008</td></tr><tr><td>Tidspunkt</td><td>01:38:29</td></tr></table></div></div><div id="b10" class="box" style="background-color:#71b8db;"><div class="box_title" style="background-color:#006699;"><img id="b10i" src="/img/arrow-right.gif" class="box_arrow" alt="Minimer / Maksimer" title="Minimer / Maksimer" onclick="box_click('b10');" />&nbsp;Funktioner</div><div id="b10c" class="box_content" style="display:none;visibility:hidden;"><a href="#message">Kommenter / Svar</a><br /><a href="/spm/829345?fullscreen=1" onclick="set_browser_width();">Vis fuld skærm</a><br /><a href="/tip.phtml">Tip en ven</a><br /><a href="java script:report_abuse();">Anmeld misbrug</a><br /><a href="/translate.phtml">Translate this page</a></div></div><div id="b23" class="box" style="background-color:#71b8db;"><div class="box_title" style="background-color:#006699;">Annonce</div><div id="b23c" class="box_content"><div style="padding:2px;"><iframe width="120" height="40" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" src="http://adserver.adtech.de/?adiframe|2.0|277|75592|1|246|target=_blank;"></iframe></div></div></div></td><td id="content" class="spm-content"><div class="you-are-here">Du er her : <a href="/">Eksperten</a> : <a href="/spm/">Spørgsmål &amp; Svar</a> : <a href="/spm/Programmering/">Programmering</a> :: <a href="/spm/Programmering/DHTML/">(D)HTML</a> :: <a href="/spm/829345">HTML: Centreret div</a> :</div><p /><div class="enews-div" onclick="document.location.href='/enyt.phtml?id=170';">Sidste nyt fra Eksperten : <b>Microsoft udviklings-community hyggeaften i Odense d. 29 maj</b><div class="enews">Arbejder du med Microsoft-produkter, s&aring; skal du m&aring;ske afs&aelig;tte d. 29. maj. for Microsoft inviterer til udvikler-hyggeaften. Stedet er Radison SAS hotel i Odense kl. 19:00 hvor der vil v&aelig;re b&aring;de v&aring;dt og...&nbsp;<span style="text-decoration: underline;">[læs mere]</span></div></div><br /><p /><table style="width: 100%;"><tr><td><h1 style="display: inline; font-size: 11pt;"><a href="/spm/829345" style="color: #000000; text-decoration: none;">HTML: Centreret div</a></h1></td><td style="text-align: right;"><img src="/img/flag_green.gif" title="Ubesvaret" class="flag_status" alt="" />&nbsp;<b>15</b>&nbsp;point fra <b><a href="/bruger.phtml?navn=dennism" style="color: #000000;">dennism</a></b></td><td valign="bottom" style="width: 50px; padding-left: 5px; font-size: 1px;"></td></tr></table><p style="clear: all;" /><div id="artbanner" style="padding-bottom: 3px; text-align:right; float:right; width:336px;"><div style="border-bottom: 2px solid #c0c0c0; width:336px;"><span title="Luk annonce" style="background-color: #c0c0c0; font-weight: bold; cursor:pointer;" onclick="artbanner_control(0,1);">&nbsp;X&nbsp;</span></div><iframe width="336" height="280" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" src="http://adserver.adtech.de/?adiframe|2.0|277|72328|1|171|target=_blank;"></iframe></div>Jeg har denne lille kode:<br /><br />&lt;div style="width:300px;height:300px;background-color:#000000;"&gt;<br />&nbsp; &nbsp; &lt;div style="width:200px;height:200px;background-color:#e0e0e0;"&gt;&lt;/div&gt;<br />&lt;/div&gt;<br /><br />Her har jeg et div inden i et andet div. Jeg vil gerne have, at det inderste div er centreret både verticalt og horisontalt.<br /><br />Håber der er nogen der kan hjælpe mig med det?</td></tr><tr valign="top"><td id="rid7097019" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7097019">Kommentar</a>: <a href="#rid7097019" onclick="post_tools(7097019,'w13',event);" class="link_black_spm">w13</a><br />27/04-2008 10:38:52</td><td class="spm-respons">Måske:<br /><br />&lt;div style="width:300px;height:300px;background-color:#000;"&gt;<br />&nbsp; &nbsp; &lt;div style="width:200px;height:200px;margin:auto;position:absolute;top:50px;background-color:#e0e0e0;"&gt;&lt;/div&gt;<br />&lt;/div&gt;</td></tr><tr valign="top"><td id="rid7098083" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7098083">Kommentar</a>: <a href="#rid7098083" onclick="post_tools(7098083,'roenving',event);" class="link_black_spm">roenving</a><br />28/04-2008 13:30:37</td><td class="spm-respons">Hrm, nok nærmere:<br /><br />&lt;div style="width:300px;height:300px;background-color:#000;position:relative;"&gt;<br />&nbsp; &nbsp; &lt;div style="width:200px;height:200px;margin:0 auto;position:relative;top:50px;background-color:#e0e0e0;"&gt;&amp;nbsp;&lt;/div&gt;<br />&lt;/div&gt;</td></tr><tr valign="top"><td id="rid7098157" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7098157">Kommentar</a>: <a href="#rid7098157" onclick="post_tools(7098157,'w13',event);" class="link_black_spm">w13</a><br />28/04-2008 14:57:39</td><td class="spm-respons">Doh! Ja, relativt self. :)</td></tr><tr valign="top"><td id="rid7098164" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7098164">Kommentar</a>: <a href="#rid7098164" onclick="post_tools(7098164,'roenving',event);" class="link_black_spm">roenving</a><br />28/04-2008 15:06:21</td><td class="spm-respons">-- det vigtige var at containeren fik en position !-)</td></tr><tr valign="top"><td id="rid7098264" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7098264">Kommentar</a>: <a href="#rid7098264" onclick="post_tools(7098264,'jeppe999',event);" class="link_black_spm">jeppe999</a><br />28/04-2008 16:54:43</td><td class="spm-respons">Hvad med:<br />&lt;div align="center"&gt;</td></tr><tr valign="top"><td id="rid7098265" class="spm-from" style="border-right: 3px solid #c0c0c0;"><a name="7098265">Kommentar</a>: <a href="#rid7098265" onclick="post_tools(7098265,'roenving',event);" class="link_black_spm">roenving</a><br />28/04-2008 16:56:40</td><td class="spm-respons">deprecated kode de sidste 10 år ,-(</td></tr><tr valign="top"><td style="border-top: 1px solid #000000; padding: 5px; padding-top: 20px;"><input type="radio" name="msg_action" value="comment" onclick="document.fexp.message.focus();" checked="checked" /><span onclick="checkbox_click('comment', 'fexp');"> Kommentar</span><br /><input type="radio" name="msg_action" value="answer" onclick="document.fexp.message.focus();" /><span onclick="checkbox_click('answer', 'fexp');"> Svar</span><p /><br /><input type="checkbox" name="subscribe" value="on" checked="checked" onclick="document.fexp.message.focus();" /><span title="Du modtager en E-Mail når der er nye indlæg i spørgsmålet." onclick="checkbox_click('msg_option', 'fexp'); document.fexp.message.focus();"> Abonnér</span><p /><a href="/pro.phtml?r=1" tabindex="0"><img src="/img/recycle.gif" class="recycle" border="0" alt="" title="Opdater [Alt-r]+[enter]" /></a><p /><br /><a href="/pro.phtml"><img src="/img/epro.png" style="width: 120px; height: 40px; border: 1px solid #006699;" alt="Køb Eksperten Pro" title="Køb Eksperten Pro" /></a></td><td style="border-top: 1px solid #000000; padding: 5px; padding-top: 20px;"><a name="message"></a><textarea name="message" cols="45" rows="10" tabindex="0" class="msg_box" accesskey="m"></textarea><br /><input type="submit" name="action" value="Send" accesskey="s" title="[alt+s]" tabindex="1" style="width:100%;" /></td></tr><tr><td colspan="2" style="padding: 15px; padding-top: 25px; text-align: center;"><script type="text/javascript"><!--
google_ad_client = "pub-7411742756402756";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "text";
//2006-12-04: Eksperten 728*90
google_ad_channel = "2275125930";
google_color_border = "006699";
google_color_bg = "FFFFFF";
google_color_link = "006699";
google_color_text = "000000";
google_color_url = "3399CC";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></td></tr></table></form><div id="qtools" class="post_tools_active"><span onclick="post_tools_action(0);" class="post_tools_link">Vis brugerinfo</span><br /><span onclick="post_tools_action(7);" class="post_tools_link">Giv Karma</span><br /></div></td></tr><tr><td colspan="2" class="margin_white"><span class="spacer"></span></td></tr></table></div>

<!-- CoolMenus: Copyright Thomas Brattli (www.dhtmlcentral.com) -->
<script type="text/javascript" language="JavaScript1.2" src="/js/coolmenus/coolmenus4.js"></script><script type="text/javascript" language="JavaScript1.2" src="/js/coolmenus/cm_addins.jfl.js"></script><script type="text/javascript" language="JavaScript1.2" src="/js/coolmenus/exp_menu.js"></script>

<div class="counters">
<iframe width="1" height="1" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" src="http://adserver.adtech.de/?adiframe|2.0|277|73011|1|16|target=_blank;"></iframe>
<!-- GALLUP -->
<script type="text/javascript" src="/tmv11.js"></script>
<script type="text/javascript">
<!--
getTMqs('http', '', '', 'idg_dk', 'dk', 'ISO-8859-15');
//-->
</script>
<noscript><img src="http://statistik-gallup.net/V11***idg_dk/dk/ISO-8859-15//" alt="" /></noscript>
<!--GALLUP SLUT -->
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-364357-5";
urchinTracker();
</script>
<!-- (C)2000-2007 Gemius SA - gemiusAudience / eksperten.dk / Main Page -->
<script type="text/javascript">
var pp_gemius_identifier = new String('bIg7_9RZsBI.BjVwPXgllbbtT.P8AgSCXEaXutCWvQz.17');
</script>
<script type="text/javascript" src="http://www.eksperten.dk/javascript/gemius/xgemius.js"></script>
</div>

Jepz, Ekspertens kode er ikke den allerbedste ...

-- og ovenikøbet har den den umulige doctype xhtml1 transitional, endda med xml-prolog, som notorisk ødelægger css-understøttelse i IE ...

xhtml1 (specielt transitional !-) kan aldrig tolkes som andet end fejlfyldt html4.01 i nogen nulevende eller kommende browsere, så det er bare tåbeligt at bruge !o]

<ole>

- og da f.eks. iframe ikke er del af HTML4.01 (kun i Transitional flavour), er der vel strengt taget tale om, at XHTML 1.0 Transitional kun er HTML3.2 i festtøj  =)

/mvh
</bole>

Roenving >>

Smider du lige et svar?

Oki '-)

-- og tak for point ;~}