Eine Styling Frage zum Menü

Neues Thema verfassen Neues Thema

Katjana
Member

Registriert: 31.10.2008
Beitraege: 108
20.11.2008 um 22:01 Uhr

Huhu liebe Leute,
ich habe da mal so eine Fragen, ich hatte jetzt mit einer Freundin eine Seite bernommen, die leider auf Oyla ist...aber jetzt hab ich die fragen, wie muss ich die CCS datei schreiben, dass das Men so in FF und alle anderen angezeigt wird, wie in IE.

Bitte im IE ffen und dann wo anders und bitte schaut nicht auf die Ordnung ich bin dabei zu sortieren.

Und so sieht die CSS:
```
#navigation {
width: 237px;
margin-top: 310px;
margin-left: 10px;
position: absolute;
} 

#navigation a {
color: #a00000;
margin: 1px 0px 1px 1px;
background-color: #d3c179;
text-align: left;
height: 15px;
width: 115px; 
text-decoration: none;
border-bottom: 2px double #a00000;
padding: 2px;
}
#navigation a:hover {
color: #d3c179;
background-color: #a00000;
height: 15px;
width: 115px; 
text-decoration: none;
border-bottom: 2px double #d3c179;
padding: 2px;
}

#navigation p {
margin: 1px 0px 1px 0px;
}
```
Das ist jetzt nur die navi.
Bitte helft mir-
Vielen Dank im Vorraus^^
LG Katjana

Der Beitrag wurde insgesamt 1 mal editiert, zuletzt 21.11.2008 um 19:06 Uhr ...
Antworten Zitat

Alice

Admin

Registriert: 14.12.2006
Beitraege: 1058

21.11.2008 um 14:47 Uhr

CSS Navigation:

#navigation {
	width: 237px;
	margin-top: 310px;
	margin-left: 10px;
	position: absolute;
} 

.float_right{
	float: right;
	width: 118px;
	margin-top: -1px;
}

#navigation a {
	display: block;
	color: #a00000;
	margin: 1px 0px 1px 1px;
	background-color: #d3c179;
	text-align: left;
	height: 15px;
	width: 113px;
	text-decoration: none;
	border-bottom: 2px double #a00000;
	padding: 2px;
}

	* html #navigation a{
		width: 115px;
	}

#navigation a:hover {
	width: 113px;
	color: #d3c179;
	background-color: #a00000;
	text-decoration: none;
	border-bottom: 2px double #d3c179;
}

	* html #navigation a:hover{
		width: 115px;
	}

HTML Navigation:

    <div id="navigation">
    	<h1>Main-Lobby</h1>
    
    	<div class="float_right">
		    <a href="http://www.oyla7.de/cgi-bin/eigenes.cgi?page=text&id=44468340&userid=45858265" target="self">Refresh</a>
		    <a href="http://www.oyla7.de/cgi-bin/eigenes.cgi?page=text&id=305193521207241493&userid=45858265" target="self">Rules</a>
		    <a href="http://www.oyla7.de/cgi-bin/eigenes.cgi?page=text&id=094049561207241360&userid=45858265" target="self">FAQ</a>
		</div>
	
		<div>
		    <a href="http://www.oyla7.de/cgi-bin/eigenes.cgi?page=text&id=07811313&userid=45858265" target="self">Link In</a>
		    <a href="http://www.oyla7.de/cgi-bin/eigenes.cgi?page=text&id=67387887&userid=45858265" target="self">Link Out</a>
		    <a href="http://www6.topsites24.de/pro/PchansPP/index.html" target="self">Toplist</a>
    	</div>
    	
    	<h1>NAVIGATION</h1>
    	
    	<div class="float_right">
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		</div>
		
		<div>
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
			<a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		    <a href="http://" target="self">Blubb</a>
		</div>
    </div>

... { signatur } ...

Antworten

Zitat

Katjana
Member

Registriert: 31.10.2008
Beitraege: 108

21.11.2008 um 18:29 Uhr

Danke, aber wofr ist denn diese
* html #navigation a{
width: 115px;
}

sowas kenn ich nmlich nicht, aber ich hab auch so noch ein problem.

Jetzt sieht das ganze so aus:

Im FF:

Im IE:

Im Apple Safari:

Sorry, dass ich damit so nerve.

Edit: Ich muss mich verbesser, im FF ist jetzt auch der Header nach unten gerutsch.

Der Beitrag wurde insgesamt 2 mal editiert, zuletzt 21.11.2008 um 18:43 Uhr ...

Antworten Zitat
Alice
Admin

Registriert: 14.12.2006
Beitraege: 1058
21.11.2008 um 19:06 Uhr

Bei #navigation fehlt:
```
position: absolute; 
```
Das hier :
```
* html #navigation a{
width: 115px;
}
```
Ist ne spezielle Angabe, die nur vom IE interpretiert wird, ein sogenannter CSS Hack

... { signatur } ...
Antworten Zitat
Katjana
Member

Registriert: 31.10.2008
Beitraege: 108

21.11.2008 um 19:22 Uhr

aso, dankeschn^^

Antworten Zitat