Sie sind nicht angemeldet.

CSS Mouseover verbreitet sich auf die ganze Seite

Frogtime

Anfänger

  • »Frogtime« ist der Autor dieses Themas

Beiträge: 13

CMS Version: 3.5

  • Nachricht senden

1

Donnerstag, 23. April 2009, 21:07

CSS Mouseover verbreitet sich auf die ganze Seite

Hallo zusammen,
ich habe ein Template für das w3bcms erstellt. Es hat auch alles super geklappt, bis ich einen Mouseovereffekt eingebaut habe. Nun ist das Hintergrundbild vom Menü hinter jedem Link. Meine Frage ist nun was mein Fehler ist?

Hier ist die Seite: http://frogtime.bplaced.net/w3bcms_3.6.0/

Mein CSS Code:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157

body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}
body {
	background-image: url(../images/bg1_02.jpg);
	background-repeat: repeat-x;
	margin-top: 0px;
	background-color: #1d1d1d;
}


h3	{
	color:#FF6600;
	font-size: 14px;
}

h1	{
	font-size: 16px;
	color: #FF6600;
}

a:link {
	color: #666666;
}
a:visited {
	color: #666666;
}
a:hover {
	color: #000000;
}
a:active {
	color: #666666;
}


#wrapper	{
	width:1080px;
}

#wrapper_left	{
	float:left;
	width:200px;
	background:#1d1d1d;
	border: 10px solid #1d1d1d;
	margin-top:120px;
}

#wrapper_right	{
	background:#1d1d1d;
	float:right;
	width: 800px;
	margin-top:0px;
	padding: 15px;	
}

#header	{
	background:#ddd;
	width:770px;
	padding: 15px;
	text-align:left;
}


#logo	{
	text-align:left;
	padding: 10px;
}


#topmenu	{
	padding: 10px;
	text-align:right;
}


#position	{
	height: 15px;
	text-align:left;
	padding-top: 5px;
	padding-bottom: 5px;
}

#seite	{
	text-align:left;
	color:#FFFFFF;
}

#time	{
	text-align:right;
	color:#FFFFFF;
}

#content	{
	padding: 15px;
	background-color: #ddd;
	text-align:left;
}
 
 

#menu ul	{
	text-align:left;
	padding:0px;
	margin:0px;
	list-style:none;
}

#menu li	{
	list-style:none;
}

#menu li a:link, a:visited	{
	background-image:url(../images/menuunacc.jpg);
	list-style:none;
	display:block;
	width:140px;
	height:20px;
	color:#666666;
	padding-left:60px;
	padding-top:5px;
	text-decoration:none;
}


#menu li a:active	{
	background-image:url(../images/menuacc.jpg);
	list-style:none;
	display:block;
	width:140px;
	height:20px;
	color:#666666;
	padding-left:60px;
	padding-top:5px;
	text-decoration:none;
}


#menu li a:hover	{
	background-image:url(../images/menuover.jpg);
	list-style:none;
	display:block;
	width:140px;
	height:20px;
	color:#000000;
	padding-left:60px;
	padding-top:5px;
	text-decoration:none;
}


#footer {
	padding:15px;
	text-align:left;
	color:#FFFFFF;
}


PHP-Quelltext

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

<!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>
<?php page_header(); ?>
</head>

<body onload="initLightbox()">
<center>

<div id="wrapper">

<div id="wrapper_left">
<div id="menu">
<?php page_menu(0); ?>
</div>
</div>

<div id="wrapper_right">
    <div id="header">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><div id="logo"><?php page_logo(); ?></div></td>
    <td><div id="topmenu"><a href="index.php?seite=2.kontakt">Kontakt</a> | <a href="index.php?seite=3.impressum">Impressum</a> | <a href="index.php?seite=5.sitemap">Sitemap</a></div></td>
  </tr>
    </table>
    </div><!--header ende-->
    <div id="position">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><div id="seite"><?php page_seite(); ?></div></td>
    <td><div id="time"><?php page_datum(); ?></div></td>
  </tr>
    </table>
    </div>
    <div id="content">
    <?php page_content(); ?>
    </div>
    <div id="footer">
    <?php page_footer(); ?>
    </div>
</div>

</div>
</center>
</body>
</html>


Ich hoffe ihr könnt mir helfen...

MfG Frogtime
Werbung

emet

Admin & Support

  • »emet« ist männlich

Beiträge: 2 530

Wohnort: Rhein/Main

Paypal:

  • Nachricht senden

2

Freitag, 24. April 2009, 11:27

Lasss mal nur für die allgemeine Formatierung:

Quellcode

 
1
2
3

a {...}

a:hover {...}


Das andere Zeugs bringt nix, ausser evtl. Farbsalat.

Und beim Menu ebenfalls - nur so:

Quellcode

 
1
2
3

#wrapper_left #menu li a {...}

#wrapper_left #menu li a:hover {...}


Also für das ganze Menu #wrapper_left vorsetzen.
.
HTML, was ist das? Ein neues Männermagazin? Css.., was es so alles gibt!

News: http://www.cms2day.de/news/1/
Features: http://www.cms2day.de/cms-funktionen/

Zufrieden mit cms2day und unserer Arbeit/Support - Spenden (-Button links) sind herzlich Willkommen - Dankeschön.
.
Werbung