l105/PO Informatica P4/specialiteiten.php

<!DOCTYPE html> <html lang="nl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> body { font-family: Arial, sans-serif; background-color: #FFD700; background: url('images/waziggraan.jpg') no-repeat center center fixed; background-size: cover; margin: 0; padding: 0; } .omslag { width: 80%; margin: auto; overflow: hidden; } .balk { display: none; /* gele balk weghalen background: #FFD700; color: #000; padding-top: 30px; min-height: 70px; */ } .balk a { color: #000; text-decoration: none; text-transform: uppercase; font-size: 16px; } #main { padding: 20px; background: #fff; margin-top: 10px; } .specialiteiten{ margin-bottom: 20px; } .specialiteiten-content{ display: flex; align-items: flex-start; } .specialiteiten h2 { color: #333; margin-top: 0 } .specialiteiten p { line-height: 1.6; flex: 1; margin: 0 20px; } .specialiteiten img { max-width: 40%; height: auto; } .specialiteiten-onder { text-align: center; color: #000; font-size: 24px; margin: 20px 0; } </style> </head> <body> <div class="balk"> <div class="omslag"> </div> </div> <div id="main" class="omslag"> <div class="specialiteiten-onder"> <h1>Specialiteiten - De Echte bakker van Ot & Okke</h1> </div> <div id="main" class="omslag"> <?php // deze div id = main kan weg dan moet ik ff extra div doen maar // geen zin nu in want alles werkt.?> <div class="specialiteiten"> <h2>Desembroden</h2> <div> <div class="specialiteiten-content"> <img src="images/desem.jpg" alt="Desembroden"> <p> Er wordt gewerkt met 3 verschillende desemculturen, allemaal met hun eigen smaak en karakter. Van de rogge en tarwedesem maken we ons Walnoten-Rozijnen brood, Rogge desem brood met gebroken rogge en ons Witte tarwe natuurdesem brood. Daarnaast hebben we een Spelt-desem in ons assortiment. Van de durum desem maken we ons heerlijke Italiaanse stokjes en ciabatta. </p> </div> </div> </div> <div class="specialiteiten"> <h2>Skitaart</h2> <div> <div class="specialiteiten-content"> <img src="images/skitaart.png" alt="Skitaart"> <p> De klassieke Doornse Skitaart, een echte specialiteit. Hazelnootschuimtaart met een gebonden kersenvulling. Op een luxe bodem met gele room. Afgewerkt met slagroom, amandelschaafsel en een rode bigarreau. </p> </div> </div> <div class="specialiteiten"> <h2>Speculaas</h2> <div> <div class="specialiteiten-content"> <img src="images/speculaas.png" alt="Speculaas"> <p> Tot op de dag van vandaag wordt er nog gewerkt met het meer dan 100 jaar oude speculaasrecept van 'De Heus', dit is altijd bewaard gebleven en in de loop van de tijd nooit aangepast. En dat proef je! Onze meermaals bekroonde speculaas is vrijwel het hele jaar door verkrijgbaar. </p> </div> </div> <div class="specialiteiten"> <h2>Oliebollen</h2> <div> <div class="specialiteiten-content"> <img src="images/oliebollen.png" alt="Oliebollen"> <p> Van der Woerd staat bekend om zijn heerlijke oliebollen. Bij de Echte Bakkers al meermalen bekroond met maar liefst 5 sterren! </p> </div> </div> </body> </html>

Resultaat

Made by Thijs Aarnoudse