PHP und CSS wollen nicht zusammen richtig funktionieren

[dubster19]

Hallo miteinander. Auch heute habe ich wieder eine Frage. ;)
In meiner anwendung lese ich mit php einen Ordner aus, indem sich Bilder(PNGs) befinden. Dazu lasse ich mir auch noch die jeweiligen Informationen jedes Bildes ausgeben.
Das ganze sieht im Code dann so aus:

<div class="projects">
<?php
$files = glob("http://www.html.de/images/screenshot/screenshot_connect/*");
 foreach ($files as $file)
{
$info = basename($file);
echo
"<li>
<a href = '$file'>
<img class='simple_pictures' src='$file' alt='Vorschau'>
</a>
"; " 
</li>";
?> <?php 
}   
?> 

<?php
foreach ($files as $text){
$info = basename($text);
?><div class="simple_hovertext"><?php
echo $info  . "\n" ."&nbsp" ."&nbsp";
echo date('r',filemtime($text));
}
?>
</div>
<div>

Nun habe ich den DIVs(welche die Bildinformationen zeigen) Klassen zugeteilt, damit ich sie im CSS noch anpassen kann.
Hier der Codeausschnitt aus meiner CSS.

.projects{
border:solid 2px red;    
position:relative;
margin: 130px 0px 0px 100px;
float:left;
width:88.5%;
height:5000px;
list-style-type:none;
overflow: hidden; 
}

.simple_pictures{
margin:30px 15px 30px 15px;
padding:3px;
float:left;
width:21%;
height:21%;
opacity:0.5;
overflow:hidden;
position:relative;

-webkit-transition: all 0.4s ease-in-out 0.4s;
-moz-transition: all 0.4s ease-in-out 0.4s;
-o-transition: all 0.4s ease-in-out 0.4s;
transition: all 0.4s ease-in-out 0.4s;
}


.simple_hovertext{
float:left;
width:21%;
height:21%;
opacity:1.0;
color:#fff;
position:absolute;
background:#000000;

    -webkit-transition: all 0.4s ease-in-out 0.4s;
    -moz-transition: all 0.4s ease-in-out 0.4s;
    -o-transition: all 0.4s ease-in-out 0.4s;
    transition: all 0.4s ease-in-out 0.4s;
}

Nun habe ich das Problem, dass sich die DIVS(die die Bildinfos beinhalten) aus meiner foreach-Schleife nicht nebeneinander anordnen lassen wollen. Der Browser generiert diese DIVs immer untereinander. Bei den Bildern funktioniert alles ohne Probleme. Nur die Anzeige der Inormationen, verpackt in DIVs, macht Probleme.
Im Browser sieht das dann so aus:


Kann mir jemand von Euch weiterhelfen?

Mfg dubster19

 

[B3nnoX]

Guten Morgen,
also erstmal schon ein Pluspunkt das du für den Quellcode die Formatierungssachen benutzt vom Forum ;)
Im Code sind aber noch einige Sachen die man anders machen könnte, du schließt zum Beispiel nach PHP Code und eröffnest gleich danach wieder PHP. Also <?php ?>

Also wenn du dir dein Quellcode aus dem Post mal in eine Datei steckst, dann kannst du die Zeile 12 löschen, er versteh nicht, was das Semikolon da soll.
Zeile 14 kannst du auch löschen, weil der HTML Code da oben auch mit PHP ausgegeben wird.
Zeile 16 und 18 kannst du auch löschen

In Zeile 21 kannst du folgendes machen

echo "<div class=\"simple_hovertext\">";

oder du arbeitest mit hochkommas

echo "<div class='simple_hovertext'>";

Zeile 26 gehört noch mit in die foreachschleife

<div class="projects">
<?php
$files = glob("http://www.html.de/images/screenshot/screenshot_connect/*");
foreach ($files as $file) {        
$info = basename($file);
echo "<li><a href = '$file'><img class='simple_pictures' src='$file' alt='Vorschau'></a></li>";
}    
foreach ($files as $text) {    
$info = basename($text);    
echo "<div class='simple_hovertext'>";    
echo $info  . "\n" ."&nbsp" ."&nbsp";    
echo date('r',filemtime($text));    
echo "</div>";
}
?>
<div>

Also das ist ungetestet, aber sollte funktionieren. Also ich vermute mal mit dem CSS lag daran, dass das schließende Div element nicht mit in der foreach schleife ist.

Ach und wenn du Bilder anbietest wegen den Fehlermeldungen oder um was zu zeigen, mach diese bitte etwas größer. Man erkennt wirklich kaum etwas auf dem Bild.