✔ kleine Probleme bei einer Seite

Biergamasda

Biergamasda

Erfahrenes Mitglied
Hi Leute, tut mir leid, dass ich nichts präziseres fürn Titel gefunden habe :)

Also, es handelt sich um folgende Seite:

http://biergamasta.bi.ohost.de/branchenratgeber

Da gibts jetzt "kleinere" Probleme mitm Layout
1. auf "Branchensuche" is der erste Eintrag komplett verhunzt...
Css dazu: http://biergamasta.bi.ohost.de/branchenratgeber/css/inserate.css

2. der IE spinnt mal wieder komplett...
Der Content bereich wird nach unten verschoben, warum weis ich beim besten willen nicht, habe eigentlich schon alles versucht.
Die Inserate selbst haben einen zu großen Zeilenabstand

css fürn content:
http://biergamasta.bi.ohost.de/branchenratgeber/css/pageLayout.css

css für die Inserate:
http://biergamasta.bi.ohost.de/branchenratgeber/css/inserate.css

ich hoffe ihr könnt mir da ein wenig weiterhelfen.

vielen Dank schon im Voraus

Mfg
 
Moin,

ich empfehle dir, im HTML-Code erstmal dafür Sorge zu tragen, dass der IE nicht im proprietären "Quirksmode" läuft, sondern das Dokument den Browsern im standardkonformen Modus übergeben wird.

Code: 
<!-- 
Document   : index
Created on : Nov 8, 2008, 2:10:58 PM
Author     : christoph
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
Zum Vergrößern anklicken....

  1.  -> Byte-Order-Mark
  2. <!-- --->-Kommentar vor Doctype
  3. Falscher Doctype (gilt für alle Browser)
Wenn diese drei Mängel beseitigt sind, der IE im "Standardsmode" aber weiterhin diese Fehlinterpretationen produziert, kann das Stylesheet analysiert werden.

mfg Maik
 
Hmm, danke erstmal, hat aber leider nix geholfen :(

Weder im IE noch im FF irgendwelche Verbesserungen feststellbar... leider

mfg
 
Ich seh im Quellcode keine Veränderung.

byte-order-mark.jpg

Und was wird hier von FF nicht richtig interpretiert?

mfg Maik
 
Hallo

Sorry, hatte aufs Bom vergessen. Habs jetzt auch rausgetan, ändert aber nicht allzu viel im Ie, außer, dass es noch schlimmer wird... im FF passt die anzeige, habe da nur lokal mitm firefox im Ubuntu komischerweise ein Anzeigeproblem, wenn ichs vom online Server lade passt alles

Ich hoffe, jetzt kann mir wer weiterhelfen *g*

lg
 
Du hast den dritten Mängel nicht beseitigt, durch den die Seite weiterhin den Browsern nicht im standardkonformen Modus übergeben wird - siehe hierzu Der »DOCTYPE-Switch« und seine Auswirkungen - Quirks Mode.

Desweiteren solltest du deine vergebenen Bezeichnernamen im CSS- und HTML-Code bzgl. ihrer Groß- und Kleinschreibung abgleichen, denn da herrschen diverse Unstimmigkeiten, und CSS verhält sich hier "case-sensitive".

Außerdem wäre ein Besuch beim w3c-Validator zu empfehlen, um das Markup zu validieren - siehe hierzu die Validator-Fehlermeldungen.

mfg Maik
 
Mit diesem HTML-Code und den nachfolgenden Korrekturen in den Stylesheets, wird die Seite in allen mir zur Verfügung stehenden Browser einheitlich dargestellt.

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Branchenratgeber</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <link rel="stylesheet" href="css/pageLayout.css" type="text/css">
        <link rel="stylesheet" href="css/inserate.css" type="text/css">
        <link rel="stylesheet" href="css/aktionen.css" type="text/css">
    </head>
    <body>
        <div id="page">
            <div id="logo"></div>
            <div id="middle">
                <div id="uppernavi">
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=5'>Kundenlogin</a></div>
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=4'>Aktionen</a></div>
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=3'>Branchenratgeber</a></div>
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=2'>Firmensuche</a></div>
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=1'>Branchensuche</a></div>
                    <div class='upperMenuPoint'><a href='/branchenratgeber/index.php?am=0'>Home</a></div>
                </div>
                <div id="leftNavi">
                    <ul class='branchenlist'><li><a href='/branchenratgeber/index.php?am=1&um=1'>Branche1</a><ul><li><a href='/branchenratgeber/index.php?am=1&um=3'>Branche 1_1</a></li></ul></li><li><a href='/branchenratgeber/index.php?am=1&um=2'>Branche 2</a></li></ul>                    <div class="leftNaviBox">
                        <div class='leftMenuPoint'><a href='http://www.google.at'>Google</a></div><div class='leftMenuPoint'><a href='http://de.wikipedia.org'>wikipedia</a></div>                    </div>
                </div>
                <div id="content">
                    <h1>Mit nur wenigen Klicks zum gewünschten Ergebnis</h1>
                    <div class='miniInserate'><div class='name'>Per Du</div><div class='branche'></div><div class='clear'></div><div class='strasse'>Rathausplatz</div><div class='plzOrt'>9500&nbsp;Villach</div><div class='clear'></div><div class='tel'>Tel: 123</div><div class='email'>perdu@aon.at</div><div class='mehrInfo'><a href='/branchenratgeber/index.php?am=i&iid=2'>mehr Info</a></div><div class='clear'></div><div class='kurzbeschreibung'>Infotext</div></div><div class='miniInserate'><div class='name'>Hartlauer</div><div class='branche'></div><div class='clear'></div><div class='strasse'>Hauptplatz</div><div class='plzOrt'>9500&nbsp;Villach</div><div class='clear'></div><div class='tel'>Tel: 04242/45 0 54</div><div class='email'>robert.hartlauer@aon.at</div><div class='mehrInfo'><a href='/branchenratgeber/index.php?am=i&iid=1'>mehr Info</a></div><div class='clear'></div><div class='kurzbeschreibung'>Hartlauer steht seit Jahren für Qualität und ist einfach supertoll!</div></div>                </div>
            </div>
            <div id="footer">
                <div class="footerpoint"><a href="/branchenratgeber/index.php?am=f&um=0">Kontakt</a></div>
                <div class="footerpoint">&nbsp;</div>
                <div class="footerpoint"><a href="/branchenratgeber/index.php?am=f&um=2">Impressum</a></div>
                <div class="footerpoint">&nbsp;</div>
                <div class="clear"></div>
            </div>
        </div>
    </body>
</html>


pageLayout.css:
CSS: 
.upperMenuPoint {
    float: right;
    width: 16.5%;
    height: 100%;
    overflow: hidden;
    background-color: silver;
    line-height: 35px;
    vertical-align: middle;
    text-align: center;
    margin-left: 1px;
}

div#leftNavi {
    /*position: absolute;*/
    margin-left:0px;
    margin-top:20px;
    float: left;
    width: 150px;
}

.leftMenuPoint {
    width: 144px;
    height: 35px;
    background-color: #FFFF77;
    margin-bottom: 2px;
    padding-left: 4px;
    line-height: 35px;
    vertical-align: middle;
}

div#content {
    width: 845px;
    margin: 2px 0;
    float: left;
}

inserate.css:
CSS: 
ul.branchenlist {
    border: 1px solid green;
    background-color: #FFFF77;
    list-style: none;
    margin:0;
    padding:0;
    padding-left: 5px;
}
ul.branchenlist ul {
    list-style-type: square;
    margin:0;
    padding:0;
    padding-left: 20px;
}


mfg Maik
 
so, habe mir das alles jetzt durchgeschaut, ausprobiert, die fehler teilweise korrigiert (wobei die w3c fehler irrelevant für die Anzeige sind - bezieht sich nur auf GET Parameter die ich nicht abfrage)

Des Weiteren habe ich mich mit diesem BOM befasst und ein nützliches tool gefunden um es zu entfernen, falls es jemandem hilft
http://www.emurasoft.com/replall/detail.htm

So, Ich hab jetzt mal 2 screenshots gemacht, soll und
ist :D (mit dem Css wie du es mir beschrieben hast)

2 bilder im Anhang (firefox und ie7)

Bild Firefox (kleines Problem habe ich noch mit dem ersten Eintrag der drinsteht, da is die erste Zeile etwas abgehoben)
Bild IE7 (passt überhaupt nix, seite ist nichtmal zentriert...)

Ich bin mit meinem Latein komplett am Ende, habe alles erdenkliche probiert und finde den Fehler einfach nit...

Mfg

//edit:
habe die neuen sourcen aufm server, sieher erster Post
 
Nimm's mir nicht übel, aber es ist müßig, dir von meiner Seite weitere Hilfe angedeihen zu lassen, denn in meinen Augen hat sich da nicht besonders viel an deinem Quellcode verändert, wenn ich einen Blick in den HTML-Code werfe, und darin noch immer die von mir zuletzt angesprochenen Fehler vorfinde (falscher Doctype, weshalb die Browser im proprietären "Quirksmodus" laufen, und eine diskrepante Vergabe der Klassenbezeichner im HTML-Code gegenüber denen im Stylesheet oder umgekehrt, Stichwort: Groß- und Kleinschreibung selbiger), die hier sehr wohl relevant für die Seitendarstellung sind. Oder glaubst du, dass ich der Märchenonkel im Forum bin?! :rolleyes:

Zum Vergleich pappe ich hier das Resultat meiner vor zwei Wochen verrichteten Arbeit an:

ff3.jpg ie7.jpg

Wenn du nicht imstande bist, einfach meine geposteten Quellcodes eins zu eins zu übernehmen, kann ich dir auch nicht weiterhelfen.

Ich habe fertig!

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück