zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Layout mittig bekommen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 02.08.2006, 11:48
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.03.2006
Beiträge: 61
Luca befindet sich auf einem aufstrebenden Ast
Standard Layout mittig bekommen

Es ist mir sehr peinlich, daß ich diese Frage stellen muß, aber da ich nicht weiterkomme, tue ich es einfach.
Ich habe eine Vorlage im Netz gefunden, die zu dem paßt, was ich machen möchte. Nur weiß ich nicht, wie ich das Layout mittig bekomme. Wo muß ich den Befehl "center" setzen und wie lautet er genau? Muß das in der css-Datei sein oder in der html-Datei.
Der Arbeitslink lautet: http://www.rund-um-ihren-pc.de/oelz/index.html
und die css-Datei sieht folgendermaßen aus:
/* CSS Dokument */

body {
width:760px;
font-family:Arial, Helvetica, sans-serif;
font-size:10pt;
color:#313131;
background:#b8cbbe;
margin:0;
padding:0;
text-align:center;
}

#wrapper {
width:90%;
margin:5px auto;
padding:0;
background: url(pics/leftflex.gif) top left repeat-y; min-width:760px;
}

#wrapper2 {
width:100%;
margin:0;
padding:0;
background: url(pics/rightflex.gif) top right repeat-y;
}

#container3c {
width:100%;
margin:0;
text-align:left;
padding:0;
}

#container3c .header {
width:100%;
margin:0 auto; padding:0;
height:120px;
background:#3a6381;
background-image:url(pics/logo.gif);background-repeat:no-repeat;
}

#container3c .columnL {
width:20%; float:left;
margin:0;
padding:0;
background: url(pics/leftflex.gif) top left repeat-y;
}

#container3c .columnR {
width:20%; float:right;
margin:0;
padding:0;
background:url(pics/rightflex.gif) top right repeat-y;
}

#container3c .content {
width:60%; float:left;
padding:0;
margin:0;
background:#ffffff;
}

#container3c .footer {
clear:both; width:100%;
margin:0;
padding:0;
background:#3a6381;
height:40px;}

/* styles */

h1 {
font-size:130%;
color:#284356;
margin:0;
padding:15px;
}

h2 {
font-size:115%;
color:#284356;
margin:0;
padding:15px;
}

p {
font-size:105%;
color:#990000;
margin:0;
padding:15px; l
ine-height:1.5em;
}

a {
text-decoration: underline;
color:#990000;
cursor:sw-resize;
}

a:hover {
background:#990000; color:#ffffff;
text-decoration:none;
}

ul {
list-style-type:none;
margin:0;
padding-left:25px;
}

li {
list-style-type: circle;
line-height:1.5em;
}

.headline {
font-size:130%;
color:#ffffff;
margin:0;
padding-top:10px;
text-align:center;
}

.bottom {
font-size:100%;
color:#ffffff;
margin:0;
padding-top:5px;
text-align:center;
}

Bitte gebt mir einen Tipp!
Danke,
Luca
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 02.08.2006, 11:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

Zitat:
Zitat von Luca
Es ist mir sehr peinlich, daß ich diese Frage stellen muß
musst Du gar nicht, es gibt ja die Suche:
http://xhtmlforum.de/search.php?searchid=10972
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 02.08.2006, 12:08
o_anonym
Gast
 
Beiträge: n/a
Blinzeln

Zusätzlich kann ich Dir anbieten bei mir abzuschreiben:

XHTML und CSS. Das habe ich mir so zusammengesucht und es funktioniert in so ziemlich allen Browsern.

Leider kann ich es nicht alles detailliert beschreiben, weil ich es, wie gesagt, zusammengesucht habe, bis es *Hokuspokus* funktioniert hat.
Mit Zitat antworten
  #4 (permalink)  
Alt 02.08.2006, 12:28
Benutzer
neuer user
 
Registriert seit: 02.05.2006
Beiträge: 37
schnuffiwuffi befindet sich auf einem aufstrebenden Ast
Standard

Ich schließe mich mal dem Thema an, da ich gerade selbst damit kämpfe. Bei mir geht es aber um ein Bild welches horizontal und vertikal zentriert erscheinen soll. Die Such im Forum brachte mich jetzt soweit, dass es horizontal zentriert ist aber vertikal noch nicht. Da hat es aber immerhin schon mal einen kleinen Abstand zur oberen Browserkante.

CSS sieht so aus:
Code:
body {
	font: 0.8em verdana;
	background-color:#6f8f5f;
	text-align: center;
	}

.background {
	/*text-align: left;*/
	width: 775px;
	margin: 0 auto;
	}
HTML so:
Code:
<div class="background">
		<img src="pics/bla.jpg" alt="blablabla. Foto: blablabla" title="blablabla. Foto: blablabla" />
	</div>
Vielleicht hat ja doch noch jemand eine schlaue Idee

Schnuffiwuffi
Mit Zitat antworten
  #5 (permalink)  
Alt 02.08.2006, 12:40
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

Das Forum hat auch eine Suchfunktion!

Vertikales zentrieren kam erst heute wieder: http://www.brunildo.org/test/img_center.html
und
http://www.brunildo.org/test/valimid2.html
und
http://www.frixon.de/tuts/vcenter.html
Mit Zitat antworten
  #6 (permalink)  
Alt 02.08.2006, 13:03
Benutzer
neuer user
 
Registriert seit: 02.05.2006
Beiträge: 37
schnuffiwuffi befindet sich auf einem aufstrebenden Ast
Standard

Wie gesagt, die Suche wurde genutzt und auch angewandt. Aber den letzten Schliff hat es eben nicht ergeben

Den hast du mir aber dafür verlinkt: http://www.frixon.de/tuts/vcenter.html
Das hat 1a funktioniert und auch der Hinweis mit der darauf folgenden abgewandelten horizontalen Positionierung hat gestimmt!

Hier nochmal der Code wie er bei mir jetzt funktioniert:

Code:
body {
	font: 0.8em verdana;
	background-color:#6f8f5f;
	}

.background {
	position:absolute;
	top: 50%;
	left: 50%;
	margin-top: -230px;
	margin-left: -386.5px;
	}
Code:
<div class="background">
		<img src="pics/bla.jpg" alt="bla. Foto: bla" title="bla. Foto: bla" />
	</div>
Also nochmals vielen Dank fürs Link posten!
Mit Zitat antworten
  #7 (permalink)  
Alt 02.08.2006, 13:13
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

Zitat:
Zitat von schnuffiwuffi
Also nochmals vielen Dank fürs Link posten!
gern geschehen!
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Was bevorzugt ihr - fixes, fluides oder elastisches Layout mimii CSS 0 19.12.2011 21:12
Myblog Layout - Eintrag Mittig remii CSS 1 16.05.2011 00:29
Bitte um Hilfe - CSS und Prozentangaben sprefer CSS 3 01.03.2011 05:11
Untermenü im IE nici CSS 10 22.06.2009 22:19
Probleme mit Layout kruemelchen26 CSS 0 15.05.2007 23:40


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:07 Uhr.