Maak ik een standaard HTML aan, met een gap in een grid layout, dan werkt het gewoon.
<html>
<style>
body
{
background-color: #000000;
color: #FFFFFF;
}
.change-grid
{
border: 1px solid;
max-width: 1020px;
display: grid;
grid-row-gap: 10px;
grid-column-gap: 10px;
grid-template-columns: auto auto;
padding: 10px;
position: absolute;
align-items: start;
}
.change-item
{
border: 1px solid;
max-width: 505px;
width: 450px;
height: 30px;
padding: 10px;
float: left;
}
</style>
<body>
<div class='change-grid'>
<div class='change-item'>1</div>
<div class='change-item'>2</div>
<div class='change-item'>3</div>
<div class='change-item'>4</div>
<div class='change-item'>5</div>
<div class='change-item'>6</div>
<div class='change-item'>7</div>
<div class='change-item'>8</div>
</div>
</body>
</html>
echter pas ik dit zelfde toe in dit en ik voeg het gedeelte van de CSS toe en van de page waar het om gaat.
.change-grid
{
border: 1px solid;
max-width: 1000px;
display: grid;
grid-row-gap: 10px;
grid-column-gap: 10px;
grid-template-columns: auto auto;
padding: 10px;
position: absolute;
align-items: start;
}
.change-item
{
border: 1px solid;
max-width: 505px;
width: 450px;
height: 30px;
padding: 10px;
float: left;
}
#changes
{
border: 1px solid;
border-color: #550000;
width: 1010px;
}
Stuke code page
echo "<div class='change-grid'>
<form id='changes' action='index.php?menu=profile&action=edityes' method='POST'>";
foreach($diff as $row) {
if($row == $nick) {
if(!empty($nick)) {
echo "<div class='change-item'>You changed Nickname to : ".$row.".</div><div class='change-item'>Was before : ".$wname."<br />
<input type='hidden' name='Nickname' value='".$row."'></div>";
}
}
if($row == $wp) {
if(!empty($wp)) {
echo "<div class='change-item'>You changed Work number to : ".$row.".</div><div class='change-item'>Was before : ".$wphone."<br />
<input type='hidden' name='Wphone' value='".$row."'></div>";
}
}
if($row == $icen1) {
if(!empty($icen1)) {
echo "<div class='change-item'>You changed ICE Name 1 to : ".$row.".</div><div class='change-item'>Was before : ".$icename1."<br />
<input type='hidden' name='ICEName1' value='".$row."'></div>";
}
}
if($row == $icep1) {
if(!empty($icep1)) {
echo "<div class='change-item'>You changed ICE number 1 to : ".$row.".</div><div class='change-item'>Was before : ".$icephone1."<br />
<input type='hidden' name='ICePhone' value='".$row."'></div>";
}
}
if($row == $icen2) {
if(!empty($icen2)) {
$icename2 = 'Never set';
echo "<div class='change-item'>You changed ICE Name 2 to : ".$row.".</div><div class='change-item'>Was before : ".$icename2."<br />
<input type='hidden' name='ICEName2' value='".$row."'></div>";
}
}
if($row == $icep2) {
if(!empty($icep2)) {
$icephone2 = 'Never set';
echo "<div class='change-item'>You changed ICE number 2 to : ".$row.".</div><div class='change-item'>Was before : ".$icephone2."<br />
<input type='hidden' name='ICEPhone2' value='".$row."'></div>";
}
}
if($row == $addr) {
if(!empty($addr)) {
echo "<div class='change-item'>You changed ICE number 2 to : ".$row.".</div><div class='change-item'>Was before : ".$eaddr."<br />
<input type='hidden' name='Address' value='".$row."'></div>";
}
}
}
echo "<div class='change-item'>If this information is correct, click <input type='submit' name='submit'> to confirm.</div><div class='change-item'>
click <b><font color='#880000'><a href='index.php?menu=profile'>here</a></font></b> to cancel</div>";
echo "</form>
</div>";
En hier werkt de gap ineens niet.
