我需要一些帮助。
我正在制作一个页面来显示一些事件。
我有以下代码:
Skole.php:
<!doctype HTML>
<head>
<style>
#container {
height: 100%;
}
</style>
<?php
// LOKAL VERSJON
include 'php/local-query.php';
// LIVE VERSJON
/*
include 'php/live-query.php';
*/
?>
<body ontouchstart>
<?php
include_once 'php/header.php';
$skoleListe = Skole::all();
$eventListe = Event::all();
$skoleAttributter = '';
$eventAttributter = '';
$skoleIsSet = '';
$distinctEvent = Event::distinct()->get(['type']);
if(isset($_GET['skoleId'])) {
$skoleIsSet = $_GET['skoleId'];
}
foreach($skoleListe as $skole) {
$skoleAttributter.= '<option value="skole.php?skoleId=' . $skole['id'] .
'">' . $skole['navn'] . '</option>';
}
foreach($distinctEvent as $event) {
$eventAttributter.= '<option value="skole.php?skoleId=' . $skoleIsSet .
"&event=" . $event['type'] . '">' . $event['type'] . '</option>';
}
?>
<select onchange="this.options[this.selectedIndex].value && (window.location= this.options[this.selectedIndex].value);">
<option value="">Velg arrangementstype</option>
<?= $eventAttributter; ?>
我不知道为什么这个空间出现了,但以下也是Skole.php的一部分
<div id="container">
<?php include 'php/EventCard.php'; ?>
</div>
<?php
include_once 'php/footer.php';?>
</body>
然后我有了我的eventcard.php:
<!doctype HTML>
<head>
<style>
#events{
display: inline-block;
line-height: 1px;
opacity: 0;
padding: 100px;
animation-name: eventsAnim;
animation-duration: 4s;
animation-fill-mode: forwards;
}
@keyframes eventsAnim{
from {opacity: 0;}
to {opacity: 1;}
}
</style>
</head>
<body>
<?php
error_reporting( error_reporting() & ~E_NOTICE );
$events = Event::with('skoler')->get();
$skoleIsSet = $_GET['skoleId'];
$eventIsSet = $_GET['event'];
if($skoleIsSet && !$eventIsSet) {
foreach($events as $event) {
if($event['skole_id'] == $skoleIsSet) {
echo '<div id="events"><h1>' . $event['title'] . '</h1>';
echo '<p>Beskrivelse: ' . $event['description'] . '</p>';
echo '<p>Pris: ' . $event['pris'] . '</p>';
echo '<p>Dato: ' . $event['date'] . '</p></div>';
}
}
} else {
foreach($events as $event) {
if($event['type'] == $eventIsSet && $event['skole_id'] == $skoleIsSet) {
echo '<div id="events"><h1>' . $event['title'] . '</h1>';
echo '<p>Beskrivelse: ' . $event['description'] . '</p>';
echo '<p>Pris: ' . $event['pris'] . '</p>';
echo '<p>Dato: ' . $event['date'] . '</p></div>';
}
}
}
?>
</body>
这是skole.php中结果的图片:
正如您所看到的,它们“无序”。
如何使条目以更有序的方式显示,“在线”? 因此,无论条目包含多少个字母,它们仍会出现在相同的位置,彼此之间的空格相同?
我希望这很清楚。
谢谢!
答案 0 :(得分:0)
您可以使用此方法排序:
$skoleListe = Skole::all().sort();
答案 1 :(得分:0)
使用带浮动的div容器:left
div{
width: 25%;
border: 0;
float: left;
padding-top: 16px;
}
&#13;
<div>
text <br>
sample text
</div><div>
text <br>
sample text
</div><div>
text <br>
sample text
</div><div>
text <br>
sample text
</div><div>
text <br>
sample text
</div><div>
text <br>
sample text
</div><div>
text <br>
sample text
</div>
&#13;
使用宽度为25%的div元素使它们连续出现