I'm trying to print out the files in a directory in php, and one to line up the text files in one list and jpg files in another(at the same horizontal height, side by side).
<!DOCTYPE html>
<html>
<body>
<?php
$files = scandir('uploads');
foreach($files as $file){
$extension = pathinfo($file,PATHINFO_EXTENSION);
if($extension == 'txt') {
echo'<div style="text-align:center; margin-left:-120px;"> <br><a href="uploads/'.$file.'">'.$file.'</a></div>';
}
if($extension == 'jpg') {
echo'<div style="text-align:center; margin-right:-120px;"> <br><a href="uploads/'.$file.'">'.$file.'</a></div>';
}
}
?>
</body>
</html>
I have the following files in the directory:
test.txt hello.txt test.jpg hello.jpg
Which gives me the output of: (in the middle of the screen
test.jpg
hello.jpg
test.txt
hello.txt
But I want something as such (in the middle of the page), where .txt files come first.
test.txt test.jpg
hello.txt hello.jpg
I've tried adding a css element of `float:left;' and then adding that class to the div's but that doesn't fix the problem.
I also tried using: display: inline-block; to no avail
Here you go
div {
text-align: center;
box-sizing: border-box;
border: 1px solid black;
width: 50%;
float:left;
}<div>
<ul>
<li><a href="files/hello.txt">Hello.txt</a></li>
<li><a href="files/test.txt">Test.txt</a></li>
</ul>
</div>
<div>
<ul>
<li><a href="files/hello.txt">Hello.jpg</a></li>
<li><a href="files/test.txt">Test.jpg</a></li>
</ul>
</div>Here's a revised edition of your PHP-code, try that together with the CSS provided in the example.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div {
text-align: center;
box-sizing: border-box;
border: 1px solid black;
width: 50%;
float:left;
}
</style>
</head>
<body>
<?php
$filetypes = ['txt','jpg']; //with the following code you'll be able to add other fileextensions as you need them
foreach ($filetypes as $ext) {
$files = glob('uploads/*.'.$ext.'');
echo '<div><ul>';
foreach($files as $file){
echo'<li><a href="'.$file.'">'.(explode('/',$file)[1]).'</a></li>';
}
echo '</ul></div>';
}
?>
</body>
</html>
</div>
If you want to output a certain format, sort your data first. e.g. make your data to be an array [ test.txt , test.jpg, hello.txt , hello.jpg] then loop it like this:
foreach($data as $key=>$val){
echo $val;
if($key%2==0) echo ' ';//here is xx.txt, so you can write your css to make it in the beginning of line
else echo "
";// here is xx.jpg, make it clear right or append it a <br>
}