Line 14: | Line 14: | ||
− | <!-- | + | <!-- Top menu --> |
+ | <div class="w3-top"> | ||
+ | <div class="w3-white w3-xlarge" style="max-width:1200px;margin:auto"> | ||
+ | <div class="w3-button w3-padding-16 w3-left" onclick="w3_open()">☰</div> | ||
+ | <div class="w3-right w3-padding-16">Mail</div> | ||
+ | <div class="w3-center w3-padding-16">My Food</div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <!-- !PAGE CONTENT! --> | ||
+ | <div class="w3-main w3-content w3-padding" style="max-width:1200px;margin-top:100px"> | ||
− | + | <!-- First Photo Grid--> | |
− | + | <div class="w3-row-padding w3-padding-16 w3-center" id="food"> | |
− | + | <div class="w3-quarter"> | |
− | + | <img src="/w3images/sandwich.jpg" alt="Sandwich" style="width:100%"> | |
− | + | <h3>The Perfect Sandwich, A Real NYC Classic</h3> | |
− | <!-- | + | <p>Just some random text, lorem ipsum text praesent tincidunt ipsum lipsum.</p> |
− | + | ||
− | <div class="w3-row-padding w3-center"> | + | |
− | <div class="w3- | + | |
− | <img src=" | + | |
</div> | </div> | ||
− | + | <div class="w3-quarter"> | |
− | <div class="w3- | + | <img src="/w3images/steak.jpg" alt="Steak" style="width:100%"> |
− | <img src=" | + | <h3>Let Me Tell You About This Steak</h3> |
− | + | <p>Once again, some random text to lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
</div> | </div> | ||
− | + | <div class="w3-quarter"> | |
− | <div class="w3- | + | <img src="/w3images/cherries.jpg" alt="Cherries" style="width:100%"> |
− | <img src=" | + | <h3>Cherries, interrupted</h3> |
+ | <p>Lorem ipsum text praesent tincidunt ipsum lipsum.</p> | ||
+ | <p>What else?</p> | ||
</div> | </div> | ||
− | + | <div class="w3-quarter"> | |
− | <div class="w3- | + | <img src="/w3images/wine.jpg" alt="Pasta and Wine" style="width:100%"> |
− | <img src=" | + | <h3>Once Again, Robust Wine and Vegetable Pasta</h3> |
− | + | <p>Lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | ||
− | <div class="w3-row-padding w3- | + | <!-- Second Photo Grid--> |
− | <div class="w3- | + | <div class="w3-row-padding w3-padding-16 w3-center"> |
− | <img src=" | + | <div class="w3-quarter"> |
− | + | <img src="/w3images/popsicle.jpg" alt="Popsicle" style="width:100%"> | |
− | + | <h3>All I Need Is a Popsicle</h3> | |
− | + | <p>Lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | + | <div class="w3-quarter"> | |
− | <div class="w3- | + | <img src="/w3images/salmon.jpg" alt="Salmon" style="width:100%"> |
− | <img src=" | + | <h3>Salmon For Your Skin</h3> |
− | + | <p>Once again, some random text to lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | + | <div class="w3-quarter"> | |
− | <div class="w3- | + | <img src="/w3images/sandwich.jpg" alt="Sandwich" style="width:100%"> |
− | <img src=" | + | <h3>The Perfect Sandwich, A Real Classic</h3> |
− | + | <p>Just some random text, lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
− | + | </div> | |
− | + | <div class="w3-quarter"> | |
− | + | <img src="/w3images/croissant.jpg" alt="Croissant" style="width:100%"> | |
− | + | <h3>Le French</h3> | |
− | + | <p>Lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.</p> | |
</div> | </div> | ||
+ | </div> | ||
− | <div class="w3- | + | <!-- Pagination --> |
− | < | + | <div class="w3-center w3-padding-32"> |
− | + | <div class="w3-bar"> | |
− | + | <a href="#" class="w3-bar-item w3-button w3-hover-black">«</a> | |
− | + | <a href="#" class="w3-bar-item w3-black w3-button">1</a> | |
− | + | <a href="#" class="w3-bar-item w3-button w3-hover-black">2</a> | |
− | "> | + | <a href="#" class="w3-bar-item w3-button w3-hover-black">3</a> |
+ | <a href="#" class="w3-bar-item w3-button w3-hover-black">4</a> | ||
+ | <a href="#" class="w3-bar-item w3-button w3-hover-black">»</a> | ||
</div> | </div> | ||
</div> | </div> | ||
− | < | + | |
− | + | <hr id="about"> | |
</body> | </body> | ||
</html> | </html> |
Revision as of 17:15, 24 July 2017
Mail
My Food
The Perfect Sandwich, A Real NYC Classic
Just some random text, lorem ipsum text praesent tincidunt ipsum lipsum.
Let Me Tell You About This Steak
Once again, some random text to lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.
Cherries, interrupted
Lorem ipsum text praesent tincidunt ipsum lipsum.
What else?
Once Again, Robust Wine and Vegetable Pasta
Lorem ipsum text praesent tincidunt ipsum lipsum.
All I Need Is a Popsicle
Lorem ipsum text praesent tincidunt ipsum lipsum.
Salmon For Your Skin
Once again, some random text to lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.
The Perfect Sandwich, A Real Classic
Just some random text, lorem ipsum text praesent tincidunt ipsum lipsum.
Le French
Lorem lorem lorem lorem ipsum text praesent tincidunt ipsum lipsum.