Problem mit dem backgrounds - Seite 2

cgdesign · #11 (**permalink**) 04.05.2008, 12:36

Hier ist erst mal deine menu.css
Ersetze die mal mit deiner.

Code:

#header_image {
	position:relative;
	padding-top:200px;
	height:0;
	z-index:85;
}

#menu1 {
	background:transparent;
	padding:10px;
	height:60px;
	margin-top:-80px;
}

html>body #menu1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/transparency/black-60.png);
}

#menu1 .menu_container1 {
	height:48px;
	line-height:48px;
	margin:0px 11px 0 0;
	padding:11px 0 0 11px;
}

#menu1 ul {
	list-style-type:none;
	margin:0;
	padding:0;
	height:37px;
	line-height:37px;
	width:100%;
	background:center left transparent repeat-x;
	position:relative;
}

#menu1 ul li {
	font-size:.9em;
}

#menu1 ul li li {
	font-size:1em;
}

#menu1 ul li ul {
	list-style-type:none;
	margin:0;
	padding:5px 0 5px 0;
	height:auto;
	line-height:auto;
	width:auto;
	position:absolute;
	top:37px;
	left:0;
	display:none;
	opacity:.9;
	filter:alpha(opacity=90);
	background:#313131;
	border:0px none;
}

#menu1 ul li ul ul {
	filter:none;
	opacity:1;
	background:none;
}

#menu1 ul li:hover {
	position:relative;
	z-index:90;
}

#menu1 ul li:hover ul {
	display:block;
}

#menu1 ul li ul ul {
	position:relative;
	top:0;
	padding:0;
	margin:0;
}

#menu1 ul li {
	background:none;
	padding:0;
	vertical-align:middle;
	float:left;
	position:relative;
	height:37px;
	line-height:37px;
	position:relative;
}

#menu1 ul li li {
	float:none;
	clear:both;
	width:auto;
	height:auto;
	margin:0;
	padding:0;
	white-space:nowrap;
	display:block;
	position:relative;
	line-height:1.3em;
}

#menu1 ul li li li {
	padding:0 0 0 2em;
}

* html #menu1 ul li li {
	width:200px;
}

#menu1 ul li a {
	font-family:Arial, Helvetica, Geneva, Verdana, sans-serif;
	text-transform:uppercase;
	display:block;
	padding:0 10px 0 10px;
	font-weight:normal;
	color:#ffffff;
	text-decoration:none;
	height:37px;
	line-height:37px;
	white-space:nowrap;
}

* html #menu1 ul li a {
	width:10px;
}

* html #menu1 ul li li a, * html #menu1 ul li li ul {
	width:100%;
}

#menu1 ul li ul li a {
	text-transform:none;
	display:block;
	font-weight:normal;
	position:relative;
	color:#ffffff;
	text-decoration:none;
	height:2.5em;
	line-height:2.5em;
}

html>body #menu1 .menu_container1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/first_menu.png);
}


.menu_end1 {
	right:0;
	width:21px;
	height:80px;
	background:transparent center left no-repeat;
	position:absolute;
	bottom:0;
}

html>body .menu_end1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/menu_end.png);
}


#menu1 ul li.top_parent a, #menu1 ul li:hover a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/reflect.png);
}


#menu1 ul li li a {
	background-image:none !important;
	filter:none !important;
}
/*
#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a {
	color:#ff6600;
}

#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a:hover {
	color:#ff6600;
}
*/
#menu1 ul li li.current_page_item li a {
	color:#ffffff;
}

#menu1 ul li:hover a, #menu1 ul li a:hover { /*, #menu1 ul li a:hover {*/
	background-color:#3d3d3d;
}
/*
#menu1 ul li.current_page_parent:hover a, #menu1 ul li.current_page_parent a:hover, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item:hover a, #menu1 ul li.current_page_item a:hover, #menu1 ul li.current_page_item a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-color:#ff6600;
}*/

#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a {
	color:#ff6600;
}

#menu1 ul li li.current_page_item a:hover {
	color:#ff6600;
}

#menu1 ul li.top_parent:hover a, #menu1 ul li.top_parent a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-color:#ff6600;
}

#menu1 ul li.current_page_parent li a, #menu1 ul li.current_page_parent li a, #menu1 ul li.current_page_item li a, #menu1 ul li.current_page_item li a, #menu1 ul li li a {
	background-color:transparent !important;
}

#menu1 .menu_container1 li.langs {
	float:right;
}

#menu1 .menu_container1 li.last_menu {
	float:right;
}

N-fans · #12 (**permalink**) 04.05.2008, 13:22

Danke wiedermal das forum ist echt richtig nett

hast du daran viel verändert ??

Also naja das hier
[QUOTE]

Zitat:

.menu_end1 {
right:0;
width:21px;
height:80px;
background:transparent center left no-repeat;
position:absolute;
bottom:0;
}

html>body .menu_end1 {
background-image:url(http://nintendofans.bplaced.net/home...menu_end.png);
}

Wird leider noch falsch angezigt an einer falschen stelle O.o

Muss ich das mit margin machen ?? Das es richtig angezeigt wird ?

cgdesign · #13 (**permalink**) 04.05.2008, 13:58

Sorry, kleiner Fehler: Noch mal das Ganze

Code:

#header_image1 {
	position:relative;
	padding-top:200px;
	height:0;
	z-index:85;
}

#menu1 {
	background:transparent;
	padding:10px;
	height:60px;
	margin-top:-80px;
}

html>body #menu1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/transparency/black-60.png);
}

#menu1 .menu_container1 {
	height:48px;
	line-height:48px;
	margin:0px 11px 0 0;
	padding:11px 0 0 11px;
}

#menu1 ul {
	list-style-type:none;
	margin:0;
	padding:0;
	height:37px;
	line-height:37px;
	width:100%;
	background:center left transparent repeat-x;
	position:relative;
}

#menu1 ul li {
	font-size:.9em;
}

#menu1 ul li li {
	font-size:1em;
}

#menu1 ul li ul {
	list-style-type:none;
	margin:0;
	padding:5px 0 5px 0;
	height:auto;
	line-height:auto;
	width:auto;
	position:absolute;
	top:37px;
	left:0;
	display:none;
	opacity:.9;
	filter:alpha(opacity=90);
	background:#313131;
	border:0px none;
}

#menu1 ul li ul ul {
	filter:none;
	opacity:1;
	background:none;
}

#menu1 ul li:hover {
	position:relative;
	z-index:90;
}

#menu1 ul li:hover ul {
	display:block;
}

#menu1 ul li ul ul {
	position:relative;
	top:0;
	padding:0;
	margin:0;
}

#menu1 ul li {
	background:none;
	padding:0;
	vertical-align:middle;
	float:left;
	position:relative;
	height:37px;
	line-height:37px;
	position:relative;
}

#menu1 ul li li {
	float:none;
	clear:both;
	width:auto;
	height:auto;
	margin:0;
	padding:0;
	white-space:nowrap;
	display:block;
	position:relative;
	line-height:1.3em;
}

#menu1 ul li li li {
	padding:0 0 0 2em;
}

* html #menu1 ul li li {
	width:200px;
}

#menu1 ul li a {
	font-family:Arial, Helvetica, Geneva, Verdana, sans-serif;
	text-transform:uppercase;
	display:block;
	padding:0 10px 0 10px;
	font-weight:normal;
	color:#ffffff;
	text-decoration:none;
	height:37px;
	line-height:37px;
	white-space:nowrap;
}

* html #menu1 ul li a {
	width:10px;
}

* html #menu1 ul li li a, * html #menu1 ul li li ul {
	width:100%;
}

#menu1 ul li ul li a {
	text-transform:none;
	display:block;
	font-weight:normal;
	position:relative;
	color:#ffffff;
	text-decoration:none;
	height:2.5em;
	line-height:2.5em;
}

html>body #menu1 .menu_container1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/first_menu.png);
}


.menu_end1 {
	right:0;
	width:21px;
	height:80px;
	background:transparent center left no-repeat;
	position:absolute;
	bottom:0;
}

html>body .menu_end1 {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/menu_end.png);
}


#menu1 ul li.top_parent a, #menu1 ul li:hover a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-image:url(http://nintendofans.bplaced.net/home/wp-content/themes/freshy2/images/menu/reflect.png);
}


#menu1 ul li li a {
	background-image:none !important;
	filter:none !important;
}
/*
#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a {
	color:#ff6600;
}

#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a:hover {
	color:#ff6600;
}
*/
#menu1 ul li li.current_page_item li a {
	color:#ffffff;
}

#menu1 ul li:hover a, #menu1 ul li a:hover { /*, #menu1 ul li a:hover {*/
	background-color:#3d3d3d;
}
/*
#menu1 ul li.current_page_parent:hover a, #menu1 ul li.current_page_parent a:hover, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item:hover a, #menu1 ul li.current_page_item a:hover, #menu1 ul li.current_page_item a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-color:#ff6600;
}*/

#menu1 ul li li a:hover, #menu1 ul li li.current_page_item a {
	color:#ff6600;
}

#menu1 ul li li.current_page_item a:hover {
	color:#ff6600;
}

#menu1 ul li.top_parent:hover a, #menu1 ul li.top_parent a, #menu1 ul li.current_page_parent a, #menu1 ul li.current_page_item a {
	background-color:#ff6600;
}

#menu1 ul li.current_page_parent li a, #menu1 ul li.current_page_parent li a, #menu1 ul li.current_page_item li a, #menu1 ul li.current_page_item li a, #menu1 ul li li a {
	background-color:transparent !important;
}

#menu1 .menu_container1 li.langs {
	float:right;
}

#menu1 .menu_container1 li.last_menu {
	float:right;
}

Hatte gar nichts weiter geändert, nur mal die richtigen Namen verwendet

N-fans · #14 (**permalink**) 04.05.2008, 14:47

So jezt hab ich noch paar andere fragen ...Also jezt ist eigentlich fast alles fertig nur ist in der normalen site nohc übern header wieder background wie mache ich das ??

naja in dieses template besteht aus sovielen css das ich da nicht mehr durchblicke O.o
Also das problem hätte ich noch und dann noch was mit dem footer aber das versuch ich erstmal alleine ....

aLSO AUF DEr normal seite ist auch noch schatten und das wollte ich nun machen aber ich krieg das nicht hin
Hier die css die den schatten machtmacht File-Upload.net - Ihr kostenloser File Hoster!
mein forum ist kaput gegangen als ich die css die den bg macht eingebunden habe Startseite - WoltLab Burning Board
MFG

cgdesign · #15 (**permalink**) 04.05.2008, 15:51

Erst mal das eine Problem: Du hast in deiner layout1.css das hier geschrieben:
#page1, #header1, #footer1 {
width:800px;
margin:0 auto 0 auto;
}
Das brauchst du aber nicht, kannst du rauslöschen, dann sieht erst mal alles wieder richtig aus.

N-fans · #16 (**permalink**) 04.05.2008, 16:13

das hat mir mein instinkt auch gesagt

aber hab mich nicht getraut das raus zu machen ....

naja bin halt noch anfänger

Naja die backgrounds werden nicht richtig angezeigt und irgendwie ist jezt abstand zwischen der navi und dem forum O.o

Hoffe du kanst mir helfen

N-fans · #17 (**permalink**) 04.05.2008, 22:10

Wollt ihr vllt die layout.css haben die header tpl und menu.css header.php ??
Ich hab nähmlich schon fast mein ganzen tag drüber überlegt was ich da machen könnte aber nix klapt T.T Ich würde sogar noch weiter machen aber ich musste um 20 uhr noch Hausaufgaben machen ... und jezt gleich schlafen ...Bitte das ist mir echt wichtig das alles schön aussiht

cgdesign · #18 (**permalink**) 05.05.2008, 10:36

Da sind halt noch mehrere kleinere Fehler bei dir drin: Die id "footer_content1" ist ja leer und deswegen ist da auch der Abstand von der Navi zum Header, da du dort noch ein padding von 10px drin hast.
Auch hast du der id page eine feste Breite mitgegeben. In deinem Block aber nicht. Also mach die feste Breite von 1120px wieder raus.
Dann musst du bei #page1, #header1, #footer1 noch ein margin: 0 auto; mitgeben. Dann zeigt er dir auch den Schatten an.

N-fans · #19 (**permalink**) 05.05.2008, 15:36

Hmmm rechts wird der schatten angezeIGT aber link nicht O.o
Hab ich vllt in der html datei was falsch gemacht ?? Könnt ihr bei meiner html mal durchgucken weil ich hab zwar die id page1 drinnen aber ich weiß nicht was ich machen muss das sie aktiviert wird ...

Naja erstmal wieder ein dickes danke.
Ich finds schon voll cool das meine page fast fertig ist !!
Nur noch den schatten und den footer und dann ist es perfekt ....

MFG

cgdesign · #20 (**permalink**) 05.05.2008, 15:53

Schau dir noch mal dein Blog genauer an. Da hat dein header ein div mit "container". Da wird dann die Klasse mit dem Hintergrundbild zugewiesen:
html>body #header .container,
html>body #footer .container {
padding:10px 0 0 10px;
margin-right:10px;
background:transparent url(images/header_shadow.png) top left repeat-y;
}

Genau dasselbe Spiel ist es auch mit dem page-Bereich. Da musst du es genauso machen. Und zwar so:
html>body #footer1 #seite {
padding:0 10px 0 10px;
background:transparent url(images/shadow_left.png) top left repeat-y;
}

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Problem mit dem Z-Index	Clubnite	CSS	2	12.06.2009 01:22
Problem mit dem Browserabstand	Phöney	CSS	2	05.04.2008 15:18
Problem mit dem IE7	uspri	CSS	11	16.12.2006 17:07
Problem mit dem einbinden von Flash	Lockhead883	(X)HTML	0	01.03.2006 06:09
problem mit dem ie beim anzeigen von infoboxen /alternative	Mythic	CSS	2	01.02.2006 09:36