 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht: 
|
Verfasst Mo 30.11.2009 19:24
Titel DIV |
  |
|
Hallo,
ich möchte gerne einige Elemente die mittels DIV ausgerichtet werden so ausrichten, das sie seitlich zentiert sind, aber einen Abstand von z.B. 200px zum oberen rand haben.
Könnt ich mir helfen?
LG
Florian
|
|
| |
   |
 |
clline
Dabei seit: 03.07.2009
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Mo 30.11.2009 19:29
Titel
|
|
|
*#dingsbums
{
width: gewünschte Breite; margin-top: 200px; margin-left: auto; margin-right: auto;
}
<div id="dingsbums">div dingsbums</div>
|
|
| |
|
|
|
Anzeige
|
|
|
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht:
|
Verfasst Mo 30.11.2009 19:46
Titel
|
|
|
Also etweder ich bin zu doof oder das funtzt nicht...
| Code: | <!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=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
body,td,th {
color: #000;
}
body {
background-color: #808080;
background-image: url(Bilder/Home_HG.jpg);
background-repeat: no-repeat;
background-position:top center;
background-attachment: scroll;
}
#Hack {
position:absolute;
z-index:1;
width:900px;
height:500px;
top:50px;
left:150px;
background-color:;
}
#Menue {
position: absolute;
top: 138px;
left: 376px;
width:785px;
background-attachment: inherit;
z-index:2;
}
#Inhalt {
position:relative;
margin-top:400px;
margin-left:200px;
z-index:2;
}
#Menue table {
width:100%;
border:none;
}
a:link {
color: #000;
}
a:visited {
color: #000;
}
a:hover {
color: #000;
}
a:active {
color: #000;
}
-->
</style>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload=
<p;MM_preloadImages('Bilder/Home_Navi/Home.jpg','Bilder/Home_Navi/Photographer.jpg','Bilder/Home_Navi/Gallery.jpg','Bilder/Home_Navi/Travel_reports.jpg','Bilder/Home_Navi/Publications.jpg','Bilder/Home_Navi/Imprint.jpg')></p>
<p> </p>
<p> </p>
<p></p>
<p>
<body>
</p>
<div id="Menue">
<table width="785px">
<tr>
<td><a href="www.outdoorphotography.de/home.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','Bilder/Home_Navi/Home.jpg',1)"><img src="Bilder/Home_Navi/Home_normal.jpg" name="Home" width="130" height="225" border="0" id="Home" /></a><a href="www.outdoorphotography.de/photo.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Photographer','','Bilder/Home_Navi/Photographer.jpg',1)"><img src="Bilder/Home_Navi/Photographer_normal.jpg" name="Photographer" width="130" height="225" border="0" id="Photographer" /></a><a href="www.outdoorphotography.de/gal.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Gallery','','Bilder/Home_Navi/Gallery.jpg',1)"><img src="Bilder/Home_Navi/Gallery_normal.jpg" name="Gallery" width="130" height="225" border="0" id="Gallery" /></a><a href="www.outdoorphotography.de/t_r.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Travel_reports','','Bilder/Home_Navi/Travel_reports.jpg',1)"><img src="Bilder/Home_Navi/Travel_reports_normal.jpg" name="Travel_reports" width="130" height="225" border="0" id="Travel_reports" /></a><a href="www.outdoorphotography.de/publ.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Publications','','Bilder/Home_Navi/Publications.jpg',1)"><img src="Bilder/Home_Navi/Publications_normal.jpg" name="Publications" width="130" height="225" border="0" id="Publications" /></a><a href="www.outdoorphotography.de/imp.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Imprint','','Bilder/Home_Navi/Imprint.jpg',1)"><img src="Bilder/Home_Navi/Imprint_normal.jpg" name="Imprint" width="128" height="225" border="0" id="Imprint" /></a></td>
</tr>
</table>
</div>
<div id=nächster Bereich"></div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html> |
kannst du mir das an dem beispiel mal verdeutlichen?
|
|
| |
|
|
clline
Dabei seit: 03.07.2009
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 01.12.2009 17:33
Titel
|
|
|
Sorry, mit Position absolute sieht die Sache etwas anders aus. Ich nehme an, Du möchtest das div #Menue (solltest Du allerdings klein schreiben, also #menue) zentrieren.
Von oben möchstest Du 200px haben, also top: 200px; vertikal zentrierst Du, indem Du die Hälfte von den width: 785px (idealer wäre 786 oder 784) als negatives margin-left nimmst, also -188px. Das ganze zentrierst Du dann mit left: 50%
Sieht also dann so aus:
position: absolute;
width: 785px;
top: 200px;
margin-left: -188px;
left: 50%;
Solltest Du eine Tabelle zentrieren wollen, muss Dir leider jemand anders unter die Arme greifen, da ich nicht mit Tabellen arbeite.
|
|
| |
|
|
| |
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
