php.de

Zurück   php.de > Webentwicklung > HTML, Usability und Barrierefreiheit

HTML, Usability und Barrierefreiheit Themen rund um Textauszeichnung, Formatierung, Barrierefreiheit und Usability.

Antwort
 
LinkBack Themen-Optionen Thema bewerten
Alt 08.04.2010, 22:01  
Neuer Benutzer
 
Registriert seit: 08.04.2010
Beiträge: 13
PHP-Kenntnisse:
Anfänger
needful ist zur Zeit noch ein unbeschriebenes Blatt
Standard [Erledigt] IE7 stellt Seite nicht richtig dar

Hallo,
ich habe das Problem, daß meine Seite mit FF und Safari sowie IE8 korrekt dargestellt wird, nicht jedoch mit IE7. Folgende Probleme:
Die Navigation links ist zu weit oben und überdeckt die Headline
Die Subnavigation ist gar nicht sichtbar bzw. wird von der Hauptnavigation verdeckt
Beispiel: Gewaltfreie Erziehung in Köln

HTML Code:
Code:
<div id="container">
  <div id="header">
  	<div id="navi_top">
        <ul>
            <li><a href="kontakt.html">Kontakt</a></li>
            <li class="trennstrich">|</li>
            <li><a href="sitemap.html">Sitemap</a></li>
            <li class="trennstrich">|</li>
            <li><a href="impressum.html">Impressum</a></li>
        </ul>
     </div>
    <p><img src="images/head.jpg" alt="Head Gewaltfreie Erziehung in Köln" />
  <!-- end #header --></div>
  <div id="sidebar1">
        <ul class="navi">
            <li><a href="index.html">Startseite</a></li>
      <li class="active"><a href="kampagne.html">Die Kampagne</a></li>
            	<ul class="subnavi">
                <li class="active2"><a href="kampagne.html">Gemeinsam für eine gewaltfreie Erziehung</a></li>
                    <li><a href="kampagne_recht.html">Das Recht des Kindes auf eine gewaltfreie Erziehung</a></li>
                    <li><a href="kampagne_hintergrund.html">Hintergrundinformation</a></li>
                    <li><a href="kampagne_bund.html">Bundeskampagne</a></li>
                </ul>
          <li><a href="aboutus.html">Wir über uns</a></li>
          <li><a href="aktuelles.html">Aktuelles</a></li>
          <li><a href="veranstaltung.html">Veranstaltungen</a></li>
          <li><a href="material.html">Kampagnenmaterial</a></li>
          <li><a href="presse.html">Presse</a></li>
          <li><a href="beratung.html">Beratung in Köln</a></li>
           <li><a href="foerderer.html">Förderer</a></li>
           </ul>
  <!-- end #sidebar1 --></div>
  <div id="sidebar2">
    <img src="images/text_schirmfrau.png" alt="Schirmfrau" /><br />
    der Kampagne<br />
    <a href="schirmfrau.html"><img src="images/sh_neven.jpg" border=0 alt="Frau Neven" /></a>
    <p><img src="images/text_schirmherr.png" alt="Schirmherr" /><br />
    der Kampagne<br />
    <a href="schirmherr.html"><img src="images/sh_roters.jpg" border=0 alt="Herr Roters" /></a></p>
    <p>Die <img class="paten" src="images/text_paten.png" alt="Paten" /><br />
    der Kampagne<br />
    <img src="images/paten.jpg" alt="Die Paten" /></p>
  <!-- end #sidebar2 --></div>
CSS-Teil:
Code:
@charset "UTF-8";
/* Allgemeine Style-Angaben */
body  {
	font: 100.01% Verdana, Helvetica, Arial, sans-serif;
	background: #FFFFFF;
	margin: 0; 
	padding: 0;
	text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
	color: #000000;
}
#container { 
	width: 900px;  
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left;
} 
.fltrt { 
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.weiterlesen {
	text-align:right;
}


/* Kopfbereich */
#header { 
	background: #fff; 
	padding: 0 10px 0 20px; 
	position:relative;
} 
#header li { 
	list-style-type: none;
	float: left;
	margin: 0px 6px 10px 6px;
	position:relative;
} 
#header ul { 
	margin-left:3px;
	position:relative;
} 
#header h1 {
	margin: 0;
	padding: 10px 0;
}
#header li.trennstrich {
	font-size:70%;
	margin-top:4px;
	position:relative;
}


/* Navigation links und Link auf Kooridinatoren */
#sidebar1 {
	float: left;
	width: 210px;
	background: #fff;
	margin-top:-20px;
	position:relative;
}
#sidebar1 p {
	margin-left:18px;
	position:relative;
}
ul.navi {
	list-style-type: none;
	margin-left: -30px;
	width: 200px;
	position:relative;
}
ul.navi li {
	background-color:#F9D861;
	padding: 15px 0px 0px 28px;
	height: 27px;
	margin-top: 5px;
	position:relative;
}
ul.navi li.active {
	background-image:url(../images/link_active.png);
	background-repeat:no-repeat;
}
a:link,
a:visited {
	text-decoration: none;
  	color:black;  
}
li a:hover,
li a:focus,
li a:active {
	color:red;
}
ul.subnavi {
	list-style-type: none;
	margin-bottom:5px;
	position:relative;
}
ul.subnavi li {
	background-color:#fff;
	padding: 5px 0px 0px 0px;
	margin-left:-12px;
	font-size:80%;
	height: auto;
	position:relative;
}
ul.subnavi li.active2 a {
	color: red;
}
#navi_top ul a:link,
#navi_top ul a:visited {
	text-decoration: none;
	color:black;
}
#navi_top { 
	background: #ddd; 
	margin-left: 528px;
} 
#navi_top li.active3 a {
	color:red;
}


/* Fixer Rand rechts mit Schirmherren und Paten */
#sidebar2 {
	float: right;
	width: 125px;
	padding-left: 10px;
	background: #FFFFFF;
	text-align:center;
	line-height:20px;
	padding-right: 30px;
}
#sidebar2 img {
	margin-top:3px;
}
#sidebar2 img.paten {
	margin-bottom:-4px;
}

/* Variabler Mittelteil */
#mainContent { 
	width:490px;
	margin-left:240px;
	margin-top: -5px;
	background-color:#fff;
}
#mainContent h1 {
	font-size:150%;
	line-height:33px;
	font-weight:lighter;
}
#mainContent p,
#mainContent li {
	font: 100.01% Helvetica, Arial, sans-serif;
	line-height:22px;
}
#mainContent a {
	color: red;
	font-weight:bold;
}
#mainContent h3 {
	font: 100.01% Helvetica, Arial, sans-serif;
	font-weight:bold;
}
#mainContent h4 {
	font: 100.01% Helvetica, Arial, sans-serif;
	font-weight:bold;
	font-style:italic;
}
#mainContent img {
	margin-bottom:15px;
}
#mainContent img.mitglieder{
	margin-left:70px;
}
#mainContent img.logo {
	margin-bottom:0px;
}
#mainContent img.schirmherr {
	float:right;
	margin-left: 10px;
}
#mainContent img.aboutus {
	margin-left: -10px;
}




/* DIV-unabhängige Regeln */

#start2 {
	width: 493px;
	height: 198px;
	line-height:20px;
	color:#fff;
	background-color:red;
}
#start2 img {
	float:left;
	margin-right:10px;
	padding-right:10px;
}
#start2 p {
	font-size:80%;
	padding: 15px 5px 0px 5px;
	line-height:18px;
}
#footer {
	clear:both;
	padding: 0 10px 0 10px;
} 
#footer p {
	font-size:80%;
	margin-left: 10px;
	padding-top: 10px;
}
Gibt's da Hilfe für mich? Ich wühle mich seit drei Stunden durch diverse Seiten zu dem Thema, komme aber nicht wirklich weiter.

Danke für jeden Kommentar.
needful ist offline   Mit Zitat antworten
Sponsor Mitteilung
PHP Code Flüsterer

Registriert seit: 21.08.2005
Beiträge: 4682
PHP-Kenntnisse:
Fortgeschritten

Alt 08.04.2010, 22:33  
Erfahrener Benutzer
 
Registriert seit: 25.01.2009
Beiträge: 1.027
PHP-Kenntnisse:
Fortgeschritten
Capfly befindet sich auf einem aufstrebenden Ast
Capfly eine Nachricht über ICQ schicken Capfly eine Nachricht über MSN schicken
Standard

Hachja, das Problem mit dem IE ...

Mach doch am besten eine Abfrage, dass wenn der IE ist, ein gleicher div-Block kommt, nur halt mit ner anderen id

HTML-Code:
<!--[if IE]><div id="ie"><![endif]--> 
__________________
MfG
~Capfly
Jetzt NEU! Cpix & Wbits Katahlan.de - Das Browsergame
Capfly ist offline   Mit Zitat antworten
Alt 08.04.2010, 22:48  
Moderator¹
 
Registriert seit: 28.03.2010
Beiträge: 7.470
PHP-Kenntnisse:
Fortgeschritten
ChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer Anblick
Standard

Die Fehler im HTML beseitigen, danach kann man weiter sehen.
ChrisB ist offline   Mit Zitat antworten
Alt 08.04.2010, 22:53  
Neuer Benutzer
 
Registriert seit: 08.04.2010
Beiträge: 13
PHP-Kenntnisse:
Anfänger
needful ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Zitat:
Zitat von ChrisB Beitrag anzeigen
Die Fehler im HTML beseitigen, danach kann man weiter sehen.
Die Fehler sind keine. Ich habe die Seiten auch schon validieren lassen und erst nen Schreck bekommen. Schaue ich in den Quellcode der Seite ist aber alles in Ordnung. Was als fehlend angemeckert wird ist tatsächlich vorhanden.
needful ist offline   Mit Zitat antworten
Alt 08.04.2010, 22:56  
Neuer Benutzer
 
Registriert seit: 08.04.2010
Beiträge: 13
PHP-Kenntnisse:
Anfänger
needful ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Hallo Capfly,
sieht zwar einfach aus Deine Lösung, aber wo soll ich das reinsetzen? Überall wo ein div ist? Mir ist der Sinn nicht ganz klar. Ich muss doch die id dann auch im CSS ansprechen und irgendwas damit machen.
*grübel*
needful ist offline   Mit Zitat antworten
Alt 08.04.2010, 23:07  
Moderator¹
 
Registriert seit: 28.03.2010
Beiträge: 7.470
PHP-Kenntnisse:
Fortgeschritten
ChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von needful Beitrag anzeigen
Die Fehler sind keine.
Wie kommst du denn darauf?

Zitat:
Ich habe die Seiten auch schon validieren lassen und erst nen Schreck bekommen. Schaue ich in den Quellcode der Seite ist aber alles in Ordnung.
Der Validator macht genau das - er schaut sich den Quellcode an, den dein Server auf einen GET-Request hin ausliefert.

Zitat:
Was als fehlend angemeckert wird ist tatsächlich vorhanden.
Was dort als fehlerhaft angemeckert wird, ist fehlerhaft.

Wenn du Verständnisprobleme mit den Meldungen des Validators hast, dann kannst du nachfragen.
ChrisB ist offline   Mit Zitat antworten
Alt 08.04.2010, 23:37  
Neuer Benutzer
 
Registriert seit: 08.04.2010
Beiträge: 13
PHP-Kenntnisse:
Anfänger
needful ist zur Zeit noch ein unbeschriebenes Blatt
Standard

OK, da war ich wohl etwas voreilig, sorry.
In der Tat verstehe ich die Meldung nicht:
Line 29, Column 33: document type does not allow element "ul" here;
assuming missing "li" start-tag
<ul class="subnavi">

Was ist hier falsch?

Der Codeabschnitt in meinem html-dokument dazu ist folgender:
Code:
  <div id="sidebar1">
        <ul class="navi">
            <li><a href="index.html">Startseite</a></li>
      		<li class="active"><a href="kampagne.html">Die Kampagne</a></li>
            	<ul class="subnavi">
                <li class="active2"><a href="kampagne.html">Gemeinsam für eine gewaltfreie Erziehung</a></li>
                    <li><a href="kampagne_recht.html">Das Recht des Kindes auf eine gewaltfreie Erziehung</a></li>
                    <li><a href="kampagne_hintergrund.html">Hintergrundinformation</a></li>
                    <li><a href="kampagne_bund.html">Bundeskampagne</a></li>
                </ul>
          <li><a href="aboutus.html">Wir über uns</a></li>
          <li><a href="aktuelles.html">Aktuelles</a></li>
          <li><a href="veranstaltung.html">Veranstaltungen</a></li>
          <li><a href="material.html">Kampagnenmaterial</a></li>
          <li><a href="presse.html">Presse</a></li>
          <li><a href="beratung.html">Beratung in Köln</a></li>
           <li><a href="foerderer.html">Förderer</a></li>
           </ul>
  <!-- end #sidebar1 --></div>
needful ist offline   Mit Zitat antworten
Alt 08.04.2010, 23:39  
Erfahrener Benutzer
 
Registriert seit: 25.01.2009
Beiträge: 1.027
PHP-Kenntnisse:
Fortgeschritten
Capfly befindet sich auf einem aufstrebenden Ast
Capfly eine Nachricht über ICQ schicken Capfly eine Nachricht über MSN schicken
Standard

Hmm, du darfst raten

Tipp: <b><b></b></b>
__________________
MfG
~Capfly
Jetzt NEU! Cpix & Wbits Katahlan.de - Das Browsergame
Capfly ist offline   Mit Zitat antworten
Alt 08.04.2010, 23:45  
Neuer Benutzer
 
Registriert seit: 08.04.2010
Beiträge: 13
PHP-Kenntnisse:
Anfänger
needful ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Achso ich muß das erste <ul> erst wieder schließen, bevor ich das zweite öffne. Und nach dem ich das zweite geschlossen habe wieder das erste öffnen.
Hier kann man ja ne Menge lernen
needful ist offline   Mit Zitat antworten
Alt 08.04.2010, 23:58  
Moderator¹
 
Registriert seit: 28.03.2010
Beiträge: 7.470
PHP-Kenntnisse:
Fortgeschritten
ChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer AnblickChrisB ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von needful Beitrag anzeigen
Achso ich muß das erste <ul> erst wieder schließen, bevor ich das zweite öffne. Und nach dem ich das zweite geschlossen habe wieder das erste öffnen.
Nein, dann hättest du ja keine Verschachtelung mehr, die die tatsächlich abzubildende Struktur ausdrückt - sondern nur mehrere Listen hintereinander.


Wie du sehr leicht bspw. bei SELFHTML nachlesen kannst, darf UL als Kindelemente nur LI enthalten.

Also packst du deine Liste, die eine Unterebene präsentieren soll, natürlich ganz einfach mit in das LI, das den Oberpunkt repräsentiert.
ChrisB ist offline   Mit Zitat antworten
Antwort


Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine 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 an
Gehe zu

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Seite für mobile Handy-Browser anpassen gruber99 PHP-Fortgeschrittene 14 25.01.2010 16:08
Php einsteiger bekommt die Seite einfach nicht online... Ludvigo PHP Tipps 2009 3 26.09.2009 15:12
[Erledigt] Zwei Formulare in einer Seite <?=david?> PHP Tipps 2009 6 21.09.2009 16:31
CURL in Seite einloggen und einen Teil parsen Matt PHP Tipps 2008 8 03.09.2009 22:30
Seite nicht mehr gültig Igäl PHP Tipps 2006 3 25.05.2006 16:08
[Erledigt] Wetten automatisch von anderer Seite beziehen PHP Tipps 2006 11 03.03.2006 09:09
Folge Seite öffnet nicht PHP Tipps 2006 4 16.02.2006 18:25
Formular - Daten für nächste Seite behalten NetLook PHP Tipps 2007 7 18.11.2005 13:21
Eigenartige Quellcode-Ausgabe (Nicht richtig übermittelt?) reimondo PHP Tipps 2005-2 10 26.10.2005 18:39
Neue Seite an einer bestimmten Stelle aufrufen PHP Tipps 2005 3 13.01.2005 10:09
blätterfunktion-limit-letzte seite PHP Tipps 2004-2 2 20.12.2004 23:56
[Erledigt] php+Seite kann nicht angeziegt werden, Seite existiert aber Server, Hosting und Workstations 2 09.09.2004 08:21
Eine 2te Seite auto matisch in neuem Fenster laden PHP Tipps 2004 4 25.08.2004 14:10
[Erledigt] Tabelle auf einer Seite auslesen und in meiner Seite wiederg PHP Tipps 2004 2 14.07.2004 08:46

Besucher kamen über folgende Suchanfragen bei Google auf diese Seite
php ie7 erkennen, php ie7, browser stellt kein php dar, navigation verdeckt container, ie7 div rechts ul mittig, li.active problem ie7, ie7 php wird nicht dargestellt, ie7 php, ie8 stellt seiten nicht richtig dar, browser stellt seiten nicht richtig dar, ie8 stellt schrift falsch dar, smileys php ie7, float right ie7 rechts, .class li.active a ie7, ie7 float:left margin-left, li ie7 float right, \float-right\ ie7, navigation in ie7 nicht richtig angzeigt, problem ie8 stellt internetseiten kursiv da, png link werden in ie8 nicht angezeigt

Alle Zeitangaben in WEZ +2. Es ist jetzt 07:19 Uhr.




Powered by vBulletin® Version 3.7.2 (Deutsch)
Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0
Aprilia-Forum, Aquaristik-Forum, Liebeskummer-Forum, Zierfisch-Forum, Geizkragen-Forum