2210892
/
WEB-Team-A4
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ausrichtung produkte

pull/1/head
Eline Steinbrecher 2023-04-26 20:16:19 +02:00
parent 25ae0c6504
commit ba737a7d78
2 changed files with 26 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
public/css/desktop.css
View File

@ -227,20 +227,27 @@ label {
margin-left: 100px; margin-left: 100px;
} }
.produktueberschrift{
.produkte{ text-align: center;
margin:50px;
border:#606060 3px solid;
display: inline-block;
margin: 10px;
} }
.produktbild{ .parent{
display: flex;
justify-content: space-around;
flex-wrap:wrap;
align-content: center;
}
.produkte{
display: flex;
border:#606060 3px solid; border:#606060 3px solid;
display: inline-block;
margin: 25px;
} }
.produktbottom{ .produktbottom{
justify-content: space-between;
display: flex;
margin:10px; margin:10px;
} }

18
public/produkte.html
View File

@ -24,11 +24,11 @@
</nav> </nav>
</header> </header>
<div class="content"> <h1 class = produktueberschrift> Produkte</h1>
<h1> Produkte</h1>
<div class="parent">
<div class="produkte"> <div class="produkte">
<img src="pictures/karotten.png" width = "250" height="250" alt="Karotten"> <img src="pictures/karotten.png" width = "300" height="300" alt="Karotten">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb">
<select name="quantity"> <select name="quantity">
@ -40,7 +40,7 @@
</div> </div>
<div class="produkte"> <div class="produkte">
<img src="pictures/sellerie.png" width = "250" height="250" alt="Sellerie"> <img src="pictures/sellerie.png" width = "300" height="300" alt="Sellerie">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb">
<select name="quantity" > <select name="quantity" >
@ -52,7 +52,7 @@
</div> </div>
<div class="produkte"> <div class="produkte">
<img src="pictures/birnen.png" width = "250" height="250" alt="Birnen"> <img src="pictures/birnen.png" width = "300" height= "300" alt="Birnen">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_rot.png" width = "50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_rot.png" width = "50" height="50" alt="FoodAmpel gelb">
<select name="quantity"> <select name="quantity">
@ -64,7 +64,7 @@
</div> </div>
<div class="produkte"> <div class="produkte">
<img src="pictures/kiwi.png" width = "250" height="250" alt="Kiwi"> <img src="pictures/birnen.png" width = "300" height="300" alt="Kiwi">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_gruen.png" width = "50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_gruen.png" width = "50" height="50" alt="FoodAmpel gelb">
<select name="quantity" > <select name="quantity" >
@ -76,7 +76,7 @@
</div> </div>
<div class="produkte"> <div class="produkte">
<img src="pictures/orangen.png" width = "250" height="250" alt="Orangen"> <img src="pictures/birnen.png" width = "300" height="300" alt="Orangen">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_gelb.png" width = "50" height="50" alt="FoodAmpel gelb">
<select name="quantity"> <select name="quantity">
@ -88,7 +88,7 @@
</div> </div>
<div class="produkte"> <div class="produkte">
<img src="pictures/aepfel.png" width = "250" height="250" alt="Äpfel"> <img src="pictures/birnen.png" width = "300" height="300" alt="Äpfel">
<div class ="produktbottom"> <div class ="produktbottom">
<img src ="pictures/FoodAmpel_gelb.png" width ="50" height="50" alt="FoodAmpel gelb"> <img src ="pictures/FoodAmpel_gelb.png" width ="50" height="50" alt="FoodAmpel gelb">
<select name="quantity"> <select name="quantity">