Maar nu is de width 33% in de echo maar op de telefoon moet de width 40% zijn. Hoe kan ik dit aanpassen? Ik krijg het maar niet voor elkaar en een CSS lijkt niet te werken in een echo.
Ik zou beginnen met het niet hardcoden van deze meuk in inline style properties.
Dit hele probleem hoort niet in PHP thuis, dit is een CSS aangelegenheid. Geef en de table (of een wrapper hieromheen) een class die responsive is (verschillende dingen doet afhankelijk van bepaalde schermgroottes).
Lappen (ongeldige, by the way) HTML echo'en is niet waar PHP voor bedoeld is.
Daar heb je gelijk in, maar de hele code heeft te maken met het inladen van apps uit een databse:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/css/stylepagina.css">
<link rel="stylesheet" href="/css/slideshow.css">
<link rel="stylesheet" href="/css/button.css">
<link rel="shortcut icon" type="image/png" href="../img/design/logo3.png"/>
<title>Digibord-tools</title>
</head>
<body>
<div id="maincontainer">
<div id="smallcolumn">
<center><a href="/index.php"><IMG SRC="../img/design/logo3.png" WIDTH="50%" ALT="Logo Meester Dennis" ></IMG> </a></center>
</div>
<div id="menucolumn">
<?php
include './style/menu.php'
?>
</div>
<div id="fullcolumn1">
<div id="blog">
<?
if (isset($_POST['zoeksoort'])) {
$zoeksoort1 = $_POST['zoeksoort'];
}else{
$zoeksoort1 = "0";
}
if (isset($_POST['zoekgroep'])) {
$zoekgroep1 = $_POST['zoekgroep'];
}else{
$zoekgroep1 = "0";
}
?>
<b>Zoek in de database:</b>
<form method="post">
<select name='zoeksoort' onchange='this.form.submit()'>
<option value="0" <?php echo ((isset($_POST['zoeksoort'])) && ($_POST['zoeksoort'] == "0")) ? 'selected' : '' ?>>Leeg</option>
<option value="1" <?php echo ((isset($_POST['zoeksoort'])) && ($_POST['zoeksoort'] == "1")) ? 'selected' : '' ?>>Applicaties</option>
<option value="2" <?php echo ((isset($_POST['zoeksoort'])) && ($_POST['zoeksoort'] == "2")) ? 'selected' : '' ?>>Tools</option>
<option value="3" <?php echo ((isset($_POST['zoeksoort'])) && ($_POST['zoeksoort'] == "3")) ? 'selected' : '' ?>>Time-timer</option>
</select>
<br>
<select name='zoekgroep' onchange='this.form.submit()'>
<option value="0" <?php echo ((isset($_POST['zoekgroep'])) and ($_POST['zoekgroep'] == "0")) ? 'selected' : '' ?>>Leeg</option>
<option value="12" <?php echo ((isset($_POST['zoekgroep'])) and ($_POST['zoekgroep'] == "12")) ? 'selected' : '' ?>>Groep 1 en 2</option>
<option value="34" <?php echo ((isset($_POST['zoekgroep'])) and ($_POST['zoekgroep'] == "34")) ? 'selected' : '' ?>>Groep 3 en 4</option>
<option value="56" <?php echo ((isset($_POST['zoekgroep'])) and ($_POST['zoekgroep'] == "56")) ? 'selected' : '' ?>>Groep 5 en 6</option>
<option value="78" <?php echo ((isset($_POST['zoekgroep'])) and ($_POST['zoekgroep'] == "78")) ? 'selected' : '' ?>>Groep 7 en 8</option>
</select>
<noscript><input type="submit" value="Submit"></noscript>
</form>
</div>
<div id="blog1">
<IMG SRC="/img/design/buttondigi.png" ALIGN="right" ALT="Foto" WIDTH="15%" ></IMG>
<b>Digibord-tools</b> <br>
Gebruik de zoekfunctie om de juiste app of tool te vinden. De door mij ontwikkelde applicaties die ook op het digibord en de desktop gebruikt kunnen worden, zijn te vinden via het zoekmenu. <br>
</div>
</div>
<div id="fullcolumn1">
<?
//-- natuurlijk moet er eerst een connectie met de database worden gemaakt:
if (!@mysql_select_db("my_dennisvanduin", @mysql_connect("localhost", "dennisvanduin", "")))
{
echo "Er kan geen database connectie gemaakt worden.";
exit();
}
//-- $_POST['zoekterm'] is de naam van het zoekveld in het formulier wat we
//-- hebben gemaakt in het vorige 'hoofdstuk'. Dit is dus de SQL code:
if ($zoekgroep1 == "0" && $zoeksoort1 == "0")
{
$sql = "SELECT img, link, naam FROM `programmas`"; /* AND `vak` = '$vak1'"; */
}
else if ($zoekgroep1 != "0" && $zoeksoort1 == "0")
{
$sql = "SELECT img, link, naam FROM `programmas` WHERE `groep` = '$zoekgroep1'"; /* AND `vak` = '$vak1'"; */
}
else if ($zoekgroep1 == "0" && $zoeksoort1 == "1")
{
$sql = "SELECT img, link, naam FROM `programmas` WHERE `soort` = '$zoeksoort1'"; /* AND `vak` = '$vak1'"; */
}
else if ($zoekgroep1 != "0" && $zoeksoort1 == "1")
{
$sql = "SELECT img, link, naam FROM `programmas` WHERE `soort` = '$zoeksoort1' AND `groep` = '$zoekgroep1'";
}
else if ($zoeksoort1 == "2")
{
$sql = "SELECT img, link, naam FROM `programmas` WHERE `soort` = '$zoeksoort1' ";
}
else if ($zoeksoort1 == "3")
{
$sql = "SELECT img, link, naam FROM `programmas` WHERE `soort` = '$zoeksoort1' ";
}
//-- voer de SQL code uit en zet dit in een variabele zodat we zometeen kunnen
//-- kijken of er een resultaat is
$res = mysql_query($sql);
//-- bekijk nu of er een resultaat is, of het zoekwoord dus gevonden is of niet
if (mysql_num_rows($res) >= 1)
{
//-- er is een resultaat gevonden, toon de resultaten via een while () loop
while ($row = mysql_fetch_array($res))
{
?>
<style>
.blank_row
{
height: 10px !important; /* Overwrite any previous rules */
background-color: #FFFFFF;
}
</style>
<?php
echo '<table cellspacing="0" background-color: "#fafafa" display:block; style="float:left; margin-right:4px;" width="33%";>
<tr bgcolor="#FFEBCC"><th>'.htmlspecialchars($row['naam']).'</th></tr>
<tr bgcolor="#FFF3E0"><th><br><A HREF="'.htmlspecialchars($row['link']).'"><img src="' .htmlspecialchars($row['img']). '"border=1; width=90%;></A></tr>
<tr background-color: "#fafafa" ><td colspan="3"></td></tr>
</table> ';
?>
<!-- And so on-->
<?php
}
?>
<?php
}
//-- als er geen resultaat is gevonden, dus als het zoekwoord niet gevonden is:
else
{
echo '<p>Er zijn geen applicaties of tools gevonden.';
}
?>
</div>
<?php
include './style/footer.php'
?>
</div>
</body>
</html>
Misschien dat het nu iets duidelijker wordt? Want de column eromheen is wel responsive maar de vakjes die ingeladen worden, dus de ene keer 5 de andere keer 8 net welke zoek functie je gebruikt moeten daarbinnen responsive passen.
