1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  1. HTML - Webmaster Forum
  2. HTML / Webmaster Forum
  3. HTML & CSS Forum

Div Probleme

  • enjoy132
  • 25. Juli 2010 um 11:56
  • enjoy132
    Anfänger
    Beiträge
    4
    • 25. Juli 2010 um 11:56
    • #1

    Hallo zusammen,
    ich ein Anfänger was Internetseite angeht.
    Ich hab jetzt für einen Freund eine erstellt wo ich Probleme mit dem IE habe.
    In FIfefos ist alles tutti aber im IE spinnt er rum.

    Weiß jemand was ich falsch haben könnte??

    Hier die Seite: http://wabersich-online.de/

    Danke für jede Hilfe!!

  • Bandit
    Gast
    • 25. Juli 2010 um 12:00
    • #2

    Siehe http://validator.w3.org/check?uri=http…=Inline&group=0

  • enjoy132
    Anfänger
    Beiträge
    4
    • 25. Juli 2010 um 12:10
    • #3

    Ah vielen Dank!!!
    Da hab ich ja mit 36 Fehler noch was vor mir :)

  • synaptic
    Forum Guru
    Reaktionen
    11
    Beiträge
    10.917
    • 25. Juli 2010 um 12:42
    • #4

    von welchem ie redest du eigentlich? ich seh da im ie7 und ie8 nich was du meinst...

  • enjoy132
    Anfänger
    Beiträge
    4
    • 25. Juli 2010 um 21:34
    • #5

    bei mir zeigt er im IE 8 auf der Seite Team den Co-Pilot nicht wie den Fahrer an.
    er wird a) nicht rechts daneben angezeigt - sondern mitting drunter b) auch ohne den grünen rahmen.

    Aber wenn bei dir alles OK dann passt das ja vielleit :)

    Hat jmd noch verbesserungen?

  • Tobse
    Kaiser(in)
    Reaktionen
    4
    Beiträge
    2.439
    • 25. Juli 2010 um 21:42
    • #6

    Ich nehm dich beim wort. Der Hintergrun irritiert und macht bei der navi viselle probleme, weil er nicht passt. Ansonsten könntest du evt. noch n Eyecatcher eibnauen, bzw. das logo zu einem machen.

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

  • synaptic
    Forum Guru
    Reaktionen
    11
    Beiträge
    10.917
    • 26. Juli 2010 um 12:52
    • #7

    lol ja auf "team" klicken zu müssen - is schon ratsam, wenn man des weiß...!

    beim nächsten mal gib doch ne anständige beschreibung ab, wass den kaputt is und gib dann auch den link zum problem und nich nur zur seite, ich hab nämlich nich rumgeklickt, sondern auf der index gesucht!

    und ums direkt mal auf den punkt zu bringen: dein doctype is murks, damit springt der browser in den quirks-mode und kann das boxmodell nicht richtig anzeigen.
    dann haste als attribut bei 36 elementen align="center", was auch humbug ist!
    und zur krönung machste ne mischung aus table und divs und schachtelst da teilweise noch tables rein- also wär ich nen browser würd ich die anzeige verweigern ;)
    ich frag mich grad nur wieso der firefox das kauderwelsch "richtig" anzeigt.

    dann vergibt man eine ID nur einzeln, wenn du sie brauchst um mehrfach nen gleichen style zu haben nimm stattdessen das attribut class und vergib im css ne klasse.

    ein menü ist selten eine ansammlung von divs, es sollte eher eine unsortierte liste (<ul>) sein mit listenelementen(<li>).
    aber statt dich nur zu kritisieren, werde ich mich mal hinsetzen und sehen wie dein problem zu lösen ist.
    sollte bis dahin niemand anderes mehr posten schreibe ich hier die lösung als edit!


    so, hier is deine team.html valide und in (meines erachtens) anständigem html:

    HTML
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de">
    <head>
        <title>CF-Rallyesport</title>
    
        <link rel="stylesheet" href="synaptic_style.css" type="text/css" />
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    </head>
    <body>
    <div id="wrapper">
        <div id="head"></div><!-- #head -->
        <div id="navi_main">
        <ul id="navi">
            <li><a href="index.html" class="link">Home</a></li>
            <li><a href="team.html" class="link">Team</a></li>
            <li><a href="bilder.html" class="link">Bilder</a></li>
            <li><a href="gb.html" class="link">Gästebuch</a></li>
            <li><a href="partner.html" class="link">Partner</a></li>
            <li><a href="links.html" class="link">Links</a></li>
            <li><a href="kontakt.html" class="link">Kontakt</a></li>
            <li><a href="impressum.html" class="link">Impressum</a></li>
        </ul><!-- #navi -->
        </div><!-- #navi_main -->
    
        <div id="main">
            <div id="driverwrap">
                <div class="fahrer">    
                    <table>
                        <tr>
                          <th>
                            Fahrer
                          </th>
                        </tr>
                        <tr>
                          <td>
                            <img src="http://wabersich-online.de/team/markus.jpg" alt="Markus  Creutzburg" />
                          </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Name</strong>: Markus  Creutzburg</span>
                          </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Geb</strong>.: 22.06.1984</span>
                          </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Wohnort</strong>: Finsterbergen</span>
                        </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Gr&ouml;&szlig;e</strong>: 1,86m</span>
                        </td>
    
    
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Familienstand</strong>: vergeben </span>
                        </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Hobbies</strong>: Motorsport, Musik machen, Karneval</span>
                        </td>
                        </tr>
    
    
                        <tr>
                          <td><span class="text"><strong>Erlernter Beruf</strong>: Hotelfachmann</span>
                        </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Lieblingsessen</strong>: Bratwurst, Pasta</span>
                          </td>
                        </tr>
                    </table>
                </div><!-- .fahrer -->
    
                <div class="fahrer">    
                    <table width="300px" border="0">
                        <tr>
                          <th>
                            Co-Pilot
                          </th>
                        </tr>
                        <tr>
                          <td>
                            <img src="http://wabersich-online.de/team/robin.jpg" alt="Robin Fischer" />
                          </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Name</strong>: Robin Fischer</span>
                          </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Geb</strong>.: 20.04.1989</span>
                          </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Wohnort</strong>: Finsterbergen</span>
                        </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Gr&ouml;&szlig;e</strong>: 1,83m</span>
                        </td>
    
    
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Familienstand</strong>: Single </span>
                        </td>
                        </tr>
                        <tr>
                          <td><span class="text"><strong>Hobbies</strong>: Motorsport, Karneval, Fu&szlig;ball</span>
                        </td>
                        </tr>
    
    
                        <tr>
                          <td><span class="text"><strong>Erlernter Beruf</strong>: Fertigungsmechaniker </span>
                        </td>
                        </tr>
                        <tr>
                          <td>
                            <span class="text"><strong>Lieblingsessen</strong>: Rouladen mit Kl&ouml;&szlig;en, Kartoffelsalat mit Fischst&auml;bchen</span>
                          </td>
                        </tr>
                    </table>
                </div><!-- .fahrer -->
            </div><!-- #driverwrap -->
            <br class="clear" />
            <div id="mechaniker">
                <table>
                    <tr>
                        <th>
                            Mechaniker
                        </th>
                    </tr>
                    <tr>
                        <td>
                            <img src="http://wabersich-online.de/team/team1.jpg" class="img_frame"  alt="Das Team" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span class="text">v.l.n.r.: Florian Marx - Dannye Baumbach - Tim Fischer - André Gessert </span>
                        </td>
                    </tr>
                </table>
            </div><!-- #mechaniker -->
    
            <div id="auto">
                <table>
                    <tr>
                        <th>
                            Das "neue" Auto
                        </th>
                    </tr>
                    <tr>
                        <td>
                            <img src="http://wabersich-online.de/team/auto.jpg" class="img_frame" alt="Das 'neue' Auto" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <ul class="text">
                                <li>Gruppe F2005/H14</li>
                                <li>1,8  GTI </li>
                                <li>Gruppe A Auspuffanlage</li>
                                <li>Rennkat</li>
                                <li>Bremse 280mm gelocht und innenbel&uuml;ftet</li>
                                <li>Heigo K&auml;fig</li>
                            </ul>
                        </td>
                    </tr>
                </table>
            </div><!-- #mechaniker -->
            <div id="footer"></div><!-- #footer -->    
        </div><!-- #main -->
    
    </div><!-- #wrapper -->
    </body>
    </html>
    Alles anzeigen

    und hier die css-datei dazu:

    Code
    *{
        padding:0;
        margin:0;
    }
    body{
        height: 99%;
        width: 100%;
        margin: 5px 0 50px 0;
        padding: 0;
        background-image:url(http://wabersich-online.de/bilder/higru-px.gif);
    }
    #wrapper{
        width: 860px;
        overflow:hidden;
        margin:0 auto;    
    }
    #head { 
        background-image:url(http://wabersich-online.de/bilder/slice/neu/header.gif); 
        width:800px; 
        height:230px; 
        margin: 0 0 0 30px; 
        border-left:1px solid #00FF00; 
        border-right:1px solid #00FF00; 
        border-top:0px solid #000000;
    }
    
    
    #navi_main {
        border-left:1px solid #00FF00; 
        border-right:1px solid #00FF00; 
        width:800px;    
        margin-left:30px;
        background-color:#000000; 
        overflow:hidden;
    }
    
    
    #navi { 
        list-style:none; 
    }
    #navi li{ 
        list-style:none; 
        width:100px; 
        height:25px; 
        background-image:url(http://wabersich-online.de/bilder/higru-px1.gif); 
        float:left; 
        padding: 10px 0px 5px 0px; 
        margin: 0 0 0 0px; 
        border-bottom:1px solid #7FFF00;
        text-align:center;
    }
    #navi li a{
        color: #FFFFFF; 
        font-family: Arial, Helvetica, sans-serif; 
        font-weight: bold; 
        text-decoration:none;
    }
    #navi li a:hover{
        color: #cccccc; 
    }
    #main{
        margin-left:30px;
        width:800px;
        border-left:1px solid #00FF00; 
        border-right:1px solid #00FF00; 
        overflow:hidden;    
    }
    #driverwrap{
        margin:0 auto;
        width:800px;
    }
    .fahrer{
        border:1px solid #00FF00;
        margin:50px 29px 0; 
        float:left; 
        width:320px; 
        height:500px;  
        border:1px solid #7FFF00; 
        text-align:center;
        padding:10px;
    }
    th{
        font-family: sans-serif;
        font-size:15px;
        color:#FFFFFF;
        font-weight: bold;
        padding-bottom:4px;
        text-decoration:underline;
    }
    .text{
        font-family: sans-serif;
        font-size:14px;
        color:#FFFFFF;
        font-stretch: normal;
        line-height: normal;
    }
    #mechaniker{
        border:1px solid #00FF00;
        margin:50px  auto 0;
        width:500px; 
        height:400px;  
        border:1px solid #7FFF00; 
        text-align:center;
        padding:10px;
    }
    #auto{
        border:1px solid #00FF00;
        margin:50px  auto 0;
        width:555px; 
        height:375px;  
        border:1px solid #7FFF00; 
        text-align:center;
        padding:10px;
    }
    #auto ul{
        text-align:left;
        width:265px;
        margin:0 auto;
    }
    #footer{
        background-color:#00FF00; 
        border-left:1px solid #00FF00; 
        border-right:1px solid #00FF00; 
        height:25px; 
        width:800px; 
        margin:50px 0 0 0;
    }
    .clear{
        clear:both;
    }
    .img_frame { 
        border:#000000 solid 1px;
    }
    Alles anzeigen

    ich habe ein paar angaben direkt von dir übernommen, obgleich ich es zum teil unsinnig fand/finde. zB nen border 1px solid black um ein bild bei dem hintergrund.. also ich find man sieht da nix von, aber nun gut, du wirst wissen wofür du das so willst..

    die absoluten pfadangaben solltest du noch in relative umwandeln.
    nimm dir ein beispiel an dem code und versuch zumindest annähernd das niveau zu erreichen und zu halten

    2 Mal editiert, zuletzt von synaptic (26. Juli 2010 um 14:30) aus folgendem Grund: code angefügt

  • enjoy132
    Anfänger
    Beiträge
    4
    • 26. Juli 2010 um 19:17
    • #8

    hey danke für die hilfreiche kritik!!
    ICh werde mich nach meinen urlaub mal dran setzen und anhand deines codes die Seite entsprechend zu bearbeiten!!!!

    Vielen Dank für deine Mühe!

Tags

  • bilder
  • browser
  • gif
  • html
  • ie
  • link
  • klasse
  • links
  • style
  • background
  • problem
  • bearbeiten
  • div
  • lösen
  • liste
  • impressum
  • xml
  • css
  • header
  • float
  • ie7
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
Zitat speichern