zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Probleme mit Top Navigator und Anzeige im Mozilla!?!?!

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 24.08.2004, 16:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.08.2004
Beiträge: 2
Patrik befindet sich auf einem aufstrebenden Ast
Standard Probleme mit Top Navigator und Anzeige im Mozilla!?!?!

Hallo Zusammen,

Zuerst möchte ich meine Begeisterung für dieses Forum aussprechen. Ich habe viele interessante Beiträge gelesen, gute Links gefunden und einiges dabei gelernt. Vielen Dank also an Alle die hier aktiv arbeiten.

Hier mein Anliegen:
Die Seite an der ich gerade arbeite soll komplett Barrierefrei und mit CSS layoutet sein. Also wird die Breite je nach Bildschirmauflösung flexibel (bis auf Margin 20px links und rechts) angepasst. Funktioniert auch soweit sehr gut.

Ich habe jetzt aber noch ein Problem mit dem Topnavigator und der Anzeige im Mozilla.
Wenn ich die Schriftgröße verändere(vergrößere), dann wird der innere Navigator (UL & LI) über den Topnav gelegt. Er soll aber darin bleiben und border-bottom des Topnav soll weiterhin dominierend über die gesamte Breite angezeigt werden.

Durch die vielen Versuche ist leider die derzeitige Code-Suppe entstanden. (z.B. die vielen * html #topnav ….) Und mittlerweile bin ich am Rande der Verzweiflung.

Den angefügten Code habe ich auf die wesentlichen Teile gekürzt.

Wenn Ihr also einen Tipp für mich habt, wie ich die Anzeige im Mozilla optimieren kann, dann bin ich absolut begeistert von CSS. Sonst nur begeistert.
Es macht sehr viel Spass, sich in CSS einzuarbeiten aber es kostet ab und an sehr viel Geduld. (z.B. bei dem Topnav!)

In der Hoffnung auf Hilfe verbleibe ich mit bestem Dank
Patrik
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Teststyle</title>

<style type="text/css">
body {
	background-color:#fff;
	margin:20px;
	padding:0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	}

.unsichtbar{	
	display:none;
	}

#topnav {
	margin:0px 0px 10px 0px;
	padding:0;
 	width:100%;
 	min-height:20px;
	border:0px;
	background-color:#CCCCCC;
	color:#ccc;
	font-family: arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	text-align: left;
	border-bottom:2px solid #036;
	}

* html #topnav{
	height:20px;
	}

#topnav ul{
	margin-left:180px;
	padding:0px;
	border-left:1px solid #036;
	font-size: 100%;
	list-style-type: none;
	}

#topnav li{
	margin:0;
	padding:0px;
	min-height:18px;
	border-right:1px solid #036;
	background-color:#ccc;
	float:left;
	}

* html #topnav  li{
	height:20px;
 	}

#topnav li a{
	display:block;
	margin:0;
	padding:2px 15px 0px 15px;
	color: #036;
	text-decoration: none;
	min-height:18px;
	font-size:100%;
	background-color:#ccc;
	list-style-type: none;
	float:left;
	}

* html #topnav li a{
	height:20px;
 	}

#topnav li a.selected, #topnav01 a.selected:hover{
	color:#fff;
	background-color:#CC0;
	}

#topnav li a:hover{
	display:block;
	color: #036;
	background-color:#F93;
	min-height:18px;
	}

* html #topnav li a:hover{
	height:20px;
	}

</style>
</head>

<body>

<div id="topnav">
<hr class="unsichtbar"><h2 class="unsichtbar">Top Navigation:</h2>
<ul>[*]Home[*]News[*]Service und Produkte[*]Partner[*]Jobs[*]Kontakt[/list]</div>

</body>
</html>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 24.08.2004, 17:22
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 24.05.2004
Beiträge: 1.176
terrikay befindet sich auf einem aufstrebenden Ast
Standard

Ist immer das Gleiche..... -> wenn Du die Links floatest, dann mußt Du danach clearen, sonst kommt der äußere Container nicht mit.

Am besten sowas: <br style="clear:left; font-size:0; line-height:0" />
direkt nach der Liste einfügen (natürlich nicht unbedingt als inline-style....)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 24.08.2004, 17:37
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.08.2004
Beiträge: 2
Patrik befindet sich auf einem aufstrebenden Ast
Standard Danke für den Tipp. So einfach!!!

Hallo Terrykay,

vielen Dank für den Tipp. So einfach war das???

Also, gelesen habe ich das auch schon mit Float und Clear. Nachdem es aber im IE einwandfrei funktioniert hat, habe ich daran leider nicht mehr gedacht.

Da die Umsetzung ohne HTML erfolgen soll, bis auf Body, Head und HTML habe ich das
durch eine Klasse .clearme ersetzt und direkt nach dem letzten[*] eingefügt.

Ist das i.O.???

Besten Dank nochmal und weiterhin viel Erfolg.
Patrik[/u]
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
Probleme mit Menü unter Mozilla Spanier CSS 0 17.02.2012 19:05
Problem mit einem 3D-Effekt moep0710 CSS 12 12.06.2010 15:30
Frage zu horizontalen Linien marvin1989 CSS 3 30.12.2009 00:35
Grafiken je nach Zustand Visu CSS 14 07.10.2009 20:28
prblemme mit mein inhalt div carlos587261 CSS 3 23.04.2008 15:07


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:49 Uhr.