Seite 1 von 1

Inhalte zentrieren

Verfasst: Mo 15. Mai 2006, 16:45
von hohorstmann
Hallo,

als Anfänger möchte ich den Inhalt der Website www.rv-rauxel.de/cms zentrieren. Dabei habe ich im Forum einen entsprechenden Beitrag gefunden, der jedoch mein Problem nicht löst. Kann ich einen Tip bekommen ?

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Contenido Demo-Seite</title>
	<link href="css/style.css" rel="stylesheet" type="text/css">
	<link href="css/style_print.css" rel="stylesheet" type="text/css" media="print">
	<!--[if IE]>
		<style>
			#imagecolumn {
				width:170px;
			}
			#logo {
				margin-top:0;
			}
			#navipath {
				padding-top:2px;
			}
			.balken {
				background-position:0px 0px ;
			}				
			#additionalnavi {
				padding-top:2px;
			}
        </style>
	<![endif]-->
<script language="javascript" type="text/javascript" src="js/jsApi.js"></script>
</head>
<body>
<div id="outer"> 
	<div id="innerwrap"> 
		<div id="centrecontent"> 
			<div id="navipath">
				<container id="60" name="Navigationspfad" types="Navigation" mode="fixed" default="Navigationspfad">Navigationspfad</container>
			</div>
			<container id="10" name="Headline" types="Content" default="Headline (HTML)">Headline (HTML)</container>
			<container id="12" name="Text" types="Content" default="">Content 1</container>
			<container id="15" name="Text" types="Content" default="">Content 2</container>
			<container id="22" name="Text" types="Content" default="">Content 3</container>
			<container id="24" name="Text" types="Content" default="">Content 4</container>
			<container id="26" name="Text" types="Content" default="">Content 5</container>
			<container id="28" name="Text" types="Content" default="">Content 6</container>
			<br/><br/>
			<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td style="background-color:rgb(210,210,210);"><img src="images/grey.gif" width="1" height="1" border="0" alt="" title=""/></td></tr></table>
			<div id="bottomnavi">
				<container id="30" name="BottomNavigation" types="Navigation" mode="fixed" default="BottomNavigation">BottomNavigation</container>
			</div>			
		</div>
		<div id="left"> 
			<container id="40" name="Hauptnavigation" types="Navigation" mode="fixed" default="Hauptnavigation">Hauptnavigation</container>
			<container id="44" name="Suche" types="Navigation" default="">Suche</container>
			<container id="48" name="Login" types="Navigation" default="">Login</container>
			<container id="49" name="Newsletter" types="Navigation" default="">Newsletter</container> </div>
	</div>
	<div id="right"></div>
	<div id="clearfooter"></div>
	<div id="header"> 
		<div id="additionalnavi"><container id="50" name="Hilfsnavigation" types="Navigation" mode="fixed" default="Hilfsnavigation">Hilfsnavigation</container></div>
		<div id="logo">
			<table width="780" border="0" cellspacing="0" cellpadding="0">
				<tr>
				<td align="center"><a href="front_content.php" title="Zur Homepage"><img src="images/logo.gif" width="780" hspace="0" height="78" border="1" alt="Logo" title="Logo"/></a></td>
<!--			
				<td><a href="front_content.php" title="Zur Homepage"><img src="images/logo.gif" width="101" hspace="30" height="61" border="0" alt="Logo" title="Logo"/></a></td>
				<td align="right"><img src="images/blank.gif" width="449" height="1" border="0"/></td>
				<td align="right"><container id="80" name="Illustration" types="Content" default=""></container></td>
!-->
				</tr>
				<tr>
					<td colspan="3" class="balken"><img src="images/blank.gif" border="0" width="780" height="5" alt=""/></td>
				</tr>
			</table>
		</div>
	</div>
</div>
<div id="imagecolumn">
	<container id="70" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
	<container id="72" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
	<container id="74" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
</div>
</body>
</html>

Verfasst: Mo 15. Mai 2006, 16:58
von Oldperl
Probier mal

Code: Alles auswählen

<div id="outer" align="center"> 
ungetestet, sollte aber gehen.

Gruß aus Franken

Ortwin

Verfasst: Mo 15. Mai 2006, 17:05
von hohorstmann
Hallo Oldperl,

damit tut sich nichts.

Hast Du noch einen Tip?

Gruß Ho

Verfasst: Mo 15. Mai 2006, 17:20
von mvf
klassische css frage, google hätte da sicher schnell eine lösung gebracht

Code: Alles auswählen

#outer{
        position:relative;
        margin:auto;
	height:100%;
	min-height:100%;
	width:780px;
	color:#000000;
	text-align:left;
}

Verfasst: Mo 15. Mai 2006, 17:37
von hohorstmann
Hallo mvf,

mein css für "outer" sieht genau so aus. Funktioniert trotzdem nicht.
Google hilft nicht in allen Nöten

;-) Ho

Verfasst: Mo 15. Mai 2006, 17:52
von mvf
hohorstmann hat geschrieben:Hallo mvf,

mein css für "outer" sieht genau so aus. Funktioniert trotzdem nicht.
Google hilft nicht in allen Nöten

;-) Ho
sorry aber ich war eben auf deiner seite und es funktioniert doch, dass bg image im body musst du natürlich auch moven

Code: Alles auswählen

#outer{ 
        position:relative; 
        margin:auto; 
        height:100%; 
        min-height:100%; 
        width:780px; 
        color:#000000; 
        text-align:left; 
background-image:url('../images/bg.gif');
}
und google hilft da 1000% !!!
leuteln ihr müsst auch ein wenig engagement zeigen,
wer eine seite mit einem cms bauen will ob nun mit contenido oder einem andern system der sollte sich darüber im klaren sein, dass man nur als 'redkteur' keine programmierkenntnisse benötigt, wohl aber als admin!

nochmal HTML/CSS und wenigstens ansatzweise php sollten als basis schon das ein, ergo: hausaufgaben machen! dann kriegst du deine imagecolumn auch alleine hin ;)

Verfasst: Mo 15. Mai 2006, 18:00
von mvf
nachtrag

um das zu erreichen
(url entfernt, demo umgebung existiert nicht mehr) 13/09/2006

muss man leider auch das layout anpassen
aber jetzt kannst du ja sowohl beim layout als auch beim css spicken ;)

Verfasst: Di 16. Mai 2006, 05:35
von hohorstmann
Moin mvf,

in meiner Einfältigkeit habe ich an zwei Stellen des Stylesheets Änderungen gemacht:

1. in "outer" wie Du es beschrieben hast
2. in "body"

Code: Alles auswählen

background-image:url('../images/bg.gif');
entfernen

Auswirkungen in der Darstellung ergaben sich nicht. Der Inhalt ist nicht zentriert.

Mein Anliegen ist es, eine Website zu erstellen, möglichst ohne mich zu sehr vertiefen zu müssen. Da dachte ich, dass es einfach in meinem Sinne sei, den Inhalt zu zentrieren. Ist das nicht so?

Gruß Ho

Verfasst: Di 16. Mai 2006, 08:46
von mvf
was soll ich da sagen?

du kannst auf condemo dir sowohl dass stylesheet abgucken als auch das layout!

wo ist jetzt das problem?

sende mich schnell deine zugangsdaten per PM ist in 3 sekunden erledigt

Verfasst: Di 16. Mai 2006, 09:00
von rezeptionist

Verfasst: Di 16. Mai 2006, 09:37
von mvf
rezeptionist hat geschrieben:Tick Tack "Die Uhr läuft" :wink:
hat doch bisi länger gedauert, aber nur weil ich den zugang nicht gleich hatte :D
rezeptionist hat geschrieben: http://www.google.de/search?q=div+zentrieren :!:
sag ich doch! (see posts above)

auf jeden fall is nu mittig, http://www.rv-rauxel.de/cms/front_content.php

@hohorstmann: bitte den zugang wieder löschen!

Verfasst: Di 16. Mai 2006, 09:49
von Dodger77
mvf hat geschrieben:auf jeden fall is nu mittig, http://www.rv-rauxel.de/cms/front_content.php
Aber nicht im IE6.

Verfasst: Di 16. Mai 2006, 09:55
von stony
so funktioniert es mit dem Nachbarn,

css:

body {
text-align: center;
}

#hauptdiv {
margin: 0px auto;
text-align: left;
}

html:
...
<body>
<div id="hauptdiv">
<p>blub bla und sonst noch so ein zeug</p>
</div>
</body>
...


sorrry noch ein nachtag: das hauptdiv braucht natürlich eine breite sonst geht es nicht!

Verfasst: Di 16. Mai 2006, 09:57
von hohorstmann
Hallo all,

es ist tatsächlich ein Problem des IE6.

Firefox geht super - Opera verschiebt eine grafischen Link

Da hätte ich lange suchen und probieren können ....

Danke allen

Verfasst: Di 16. Mai 2006, 10:14
von hohorstmann
Wow stony,

jetzt geht es auch im IE6.

Dank eines Anfängers für die guten Tipps.

Gruß, Ho