Archivlink: javarea.de Forum > (X)HTML & CSS (allgemein) > seite opera-fähig machen
Vollständigen Link anzeigen: javarea.de Forum > (X)HTML & CSS (allgemein) > seite opera-fähig machen

Pages: [1]
geschrieben von Raver2 am 02.10.2005 - 13:07
hi,

wie kann ich folgende Seite Opera-fähig machen ?
im IE und FF funktioniert sie Prima, bloß im Op. ist alles verschoben...

ich habe schon 2 Tage herumprobiert...

http://bergmon.de/ugog.php



(Screenshot vom Feund...)

geschrieben von Matneu am 02.10.2005 - 16:00
Über eine Seite zu sprechen, die keine Doc-Type-Angabe hat und nicht valide ist macht IMO wenig Sinn. Ich würde an Deiner Stelle die Seite valide gestalten, das Menü etc. in DIV-Container packen und diese relativ ausrichten (float und ggf. margins setzen), dann sollte es auch mit Opera klappen. Generell würde ich erstmal das Grundgerüst machen (also den Header, das Menü und den Content) und dann mit Inhalten füllen.

Generell würde ich auch auf solche Sachen wie (feste) Höhe oder Weite und "left" und "right" weitestgehend verzichten und das ganze dynamisch machen.
Ausserdem den Code aufräumen und einrücken, so kann da vermutlich niemand was mit anfangen. Code wie
HTML-Quelltext
1: 
2: 

<center>
<p><br><p>

ist auch nicht wirklich sinnvoll, dafür gibt es schliesslich CSS.

Generell würde ich so anfangen:
HTML-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: 
47: 
48: 
49: 
50: 
51: 
52: 
53: 
54: 
55: 
56: 
57: 
58: 
59: 
60: 
61: 
62: 
63: 
64: 
65: 
66: 
67: 
68: 
69: 
70: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<title>
			Foo
		</title>
		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
		<meta http-equiv="pragma" content="nocache" />
		<style type="text/css">
			body {
				margin:50px;
				background-color:#ccc;
				font-family:sans-serif;
			}
			.header {
				text-align:center;
				background-color:#f00;
				height:100px;
			}
			.unten {
				padding:30px;
				background-color:#ff0;
			}
			.menu {
				float:left;
				margin-left:0px;
				margin-right:auto;
				background-color:#0f0;
				width:100px;
			}
				.menu a {
					text-decoration:none;
					display:block;
					margin:2px;
					padding:2px;
				}
				.menu a:hover {
					background-color:#fff;
				}
			.content {
				top:0px;
				margin-left:130px;
				margin-right:auto;
				background-color:#00f;
			}
		</style>
	</head>
	<body>
		<div class="header">
			K&ouml;pfchen ;)
		</div>
		<div class="unten">
			<div class="menu">
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
				<a href="#">Men&uuml;</a>
			</div>
			<div class="content">
				Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. Ganz viel textueller Inhalt. 
			</div>
		</div>
	</body>
</html>


So far...
Matthias

geschrieben von Raver2 am 02.10.2005 - 17:12
Zitat
 Original geschrieben von Matneu am 02.10.2005 - 16:00
[..]
Generell würde ich auch auf solche Sachen wie (feste) Höhe oder Weite und "left" und "right" weitestgehend verzichten und das ganze dynamisch machen.
[..]


ich möchte es aber so... , da die Hintergrundgrafik aus einer einzigen grafik besteht...

aber ich mache es jetzt mit Tabellen

EDIT: ich habe Fertig! - und es ist perfekt...


Powered by: JBB v.2.0.4 Copyright ©2000-2006, www.javarea.de.