• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

DIV länger als definiert

Nobody1993

Mitglied
Hallo Leute,

am Beispiel meiner Website würde ich euch gerne um Rat fragen:

Wer sie sich im FF ansieht wird sehen, wie sie aussehen solln. Unter Internet Explorer jedoch habe ich ein großes Problem:

BKB-Fuball-Website

Auf der 1. News-Seite (und nur da) ist meine Seite zu breit. Irgendwas bewegt diese dazu, sich zu verbreiten und dadurch zu repeaten. NUn habe ich geschaut.
Es liegt an der Div newsinhalt. Habe diese auf width: 200px; gesetzt. Der Text darin wird zusammengeschoben, jedoch wiederholt sich das Bild weiterhin.

Ich schaffe es einfach nicht, die Div von der Breite zu verkleinern.

Meine .css:

Code:
.news
{
    float: left;
    position: relative;
    left:10%;
}

.newstr
{
    float: left;
    position: relative;
    background-color: #000000;
    z-index: 20;
}

.newstd
{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 10px; 
    padding-right: 10px;
}

.newsfullt
{
    background-image: url(./images/slidet.png);
    background-repeat: no-repeat;
    padding-right: 20px;    
}

.newsinhalt 
{
    
}

.newsbanner
{
    position:relative;
    left:-39.5%; /* mac ie5.x doesn't like position relative */
    z-index: 2;
}
    
.button1
{
    background-image:url(./images/news_n.png);
    padding-left: 264px;
}

.button1:hover
{
    background-image:url(./images/news_h.png);
}

.button2
{    
    background-image:url(./images/galerie_n.png);
    margin-left: -4px;
}

.button2:hover
{
    background-image:url(./images/galerie_h.png);
}

.button3
{    
    background-image:url(./images/gaestebuch_n.png);
    margin-left: -4px;
}

.button3:hover
{
    background-image:url(./images/gaestebuch_h.png);
}

.button4
{    
    background-image:url(./images/presse_n.png);
    margin-left: -4px;
}

.button4:hover
{
    background-image:url(./images/presse_h.png);
}

.button5
{    
    background-image:url(./images/kontakt_n.png);
    margin-left: -4px;
}

.button5:hover
{
    background-image:url(./images/kontakt_h.png);
}

.button6
{
    background-image:url(./images/geschichte_n.png);
    margin-left: -4px;
}

.button6:hover
{
    background-image:url(./images/geschichte_h.png);
}

Codepart:

PHP:
<?php
    /*
        Autor: Tim Lübbe
        Datum: 22.12.2011
        Dieses Script ist Eigentum von Tim Lübbe. Verwendung ist ausschließlich mit Genehmigung erlaubt.
        Diese Information darf nicht gelöscht werden.
    */
    $Namen = scandir('./news/', 1);
    $Pictures = scandir('./newsb/', 0);
    echo '<div>';
        echo '<div class="news">';
            echo '<table align="left" style="background-color: #000000; opacity: 0.7;" cellspacing=0 border=0>';
                echo '<tr class="newstr">';
                        for ($i = 4; $i >= 0; $i--) {
                            echo '<td class="newstd" onmouseover="this.style.background=\'#555555\';" onmouseout="this.style.background=\'#000000\';">';
                            echo '<a href="./news.php?art='.$i.'" class="newslink";">';
                            $laenge = strlen($Namen[$i]);
                            echo ''.str_replace("_", " ", substr($Namen[$i], 3, $laenge-7));
                            echo '</a>';
                            echo '</td>';
                        }
                echo '</tr>';
            echo '</table>';
            echo '<div class="newsbanner">';
            if(substr($Pictures[(sizeof($Pictures)-1)-$_GET['art']],0,1) == '.') {
                echo '<img src="./images/noimage.png">';
            } else {
                echo '<img src="./newsb/'.$Pictures[(sizeof($Pictures)-1)-$_GET['art']].'">';
            }
            echo '</div>';
            echo '<div align="left" class="newsinhalt">';
            $article=isset($_GET['art'])?substr($_GET['art'],0,20):'';
            $file = file('./news/'.$Namen[$article]);
            if ($file)
            {
                echo '<div class="newsfullt"></div>
                      <div class="newsfullm">
                      <div class="newstitle">'.$file[0].'</div>
                      <div class="newsautor">'.$file[1].'</div>
                      <div style="clear: both;"></div>
                      <hr>
                      <div class="newstext">';
                      for($i = 2; $i < (count($file)); $i++)
                      {
                        echo unBBcode($file[$i])."<br>";
                      }
                      echo'</div>
                      </div>
                     <div class="newsfullb"></div>';
            } 
            echo '</div>';
        echo '</div>';
    echo '</div>';
?>


Vielleicht weiß jemand rat? :) Wäre sehr nett, wenn ich hilfe bekommen worde.


Grüße,
Nobody1993
 
Werbung:
Code:
<html><head><title>BKB-Fußball-Website</title><link rel="stylesheet" type="text/css" href="ff.css"><!--[if IE]><link rel="stylesheet" type="text/css" href="ie.css"><![endif]--><link rel="stylesheet" type="text/css" href="style.css"></head><body style="background-color: #8d9099;"><center><div class="body"><div class="header"><div class="navi"><div class="navbar"><a href="./news.php?art=0"><div class="button1"></div></a><a href="./galery.php"><div class="button2"></div></a><a href="./guestbook.php?page=index"><div class="button3"></div></a><a href="./presse.php?page=index"><div class="button4"></div></a><a href="./kontakt.php?page=index"><div class="button5"></div></a><a href="./geschichte.php?page=index"><div class="button6"></div></a><a href="#"><div class="button7"></div></a></div></div></div><div><div class="news"><table align="left" style="background-color: #000000; opacity: 0.7;" cellspacing=0 border=0><tr class="newstr"><td class="newstd" onmouseover="this.style.background='#555555';" onmouseout="this.style.background='#000000';"><a href="./news.php?art=4" class="newslink";">Testtitel1</a></td><td class="newstd" onmouseover="this.style.background='#555555';" onmouseout="this.style.background='#000000';"><a href="./news.php?art=3" class="newslink";">Testtitel3</a></td><td class="newstd" onmouseover="this.style.background='#555555';" onmouseout="this.style.background='#000000';"><a href="./news.php?art=2" class="newslink";">Erste Testnews</a></td><td class="newstd" onmouseover="this.style.background='#555555';" onmouseout="this.style.background='#000000';"><a href="./news.php?art=1" class="newslink";">12341234</a></td><td class="newstd" onmouseover="this.style.background='#555555';" onmouseout="this.style.background='#000000';"><a href="./news.php?art=0" class="newslink";">BBcode-Test</a></td></tr></table><div class="newsbanner"><img src="./images/noimage.png"></div><div align="left" class="newsinhalt"><div class="newsfullt"></div>
                      <div class="newsfullm">
                      <div class="newstitle">Testtitel1
</div>
                      <div class="newsautor">geschrieben von Schrubber am 04.01.2012 - 16:41 Uhr (bearbeitet).
</div>
                      <div style="clear: both;"></div>
                      <hr>
                      <div class="newstext">Zeile1
<br>
<br>Zeile2
<br>
<br>Zeile3
<br>
<br>Zeile4
<br>
<br>Zeile5<br></div>
                      </div>
                     <div class="newsfullb"></div></div></div></div></div><div class="footer"><br><br><br></div></body></html>
 
Werbung:
Prüfe deine Seiten immer im The W3C Markup Validation Service

Der Doctype fehlt dir schon mal. Und dann sind da immer noch jede Menge Fehler.

Abgesehen davon solltest du lernen wie man die Elemente in Html richtig anwendet.
 
Was verstehst du nicht?

Findest du das normal:
HTML:
<body style="background-color: #8d9099;">
    <center>
        <div class="body">
            <div class="header">
                <div class="navi">
                    <div class="navbar">

HTML ist nicht für das aussehen da. Alle das Aussehen betreffende Angaben, CSS-Formatierungen, gehören ins Stylesheet.

Warum 2 divs für die Navi?
Warum zentrierst du mit dem Element center, das muss mit CSS gemacht werden.
Wozu ist das div body da?

So zieht es sich durch deinen ganzen Quelltext.
 
Werbung:
Zurück
Oben