-
Notifications
You must be signed in to change notification settings - Fork 91
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
first upload of the learning project #62
base: master
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The basic structure of your html looks very good, well done! 💪🏽 I've made a few suggestions where you could simplify or improve UX but it's a great foundation 👍 Amazing how far you've come in just a few weeks. You can really be proud of yourself 😊
code/index.html
Outdated
<li class="wishlist"> | ||
<div class="wunsch-container"> | ||
<div class="wunsch-Bild"> | ||
<img | ||
class="image-wunsch" | ||
src="./images/Abendessen.jpg" | ||
alt="Bild zNacht" | ||
/> | ||
</div> | ||
<div class="wunsch-Text"> | ||
<p> | ||
Gemütliches Nachtessen <br /> | ||
<strong>100 CHF</strong> | ||
</p> | ||
</div> | ||
</div> | ||
</li> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You could simplify the html structure for all the li
elements as follows (with a few CSS changes; see other comment):
<li class="wishlist"> | |
<div class="wunsch-container"> | |
<div class="wunsch-Bild"> | |
<img | |
class="image-wunsch" | |
src="./images/Abendessen.jpg" | |
alt="Bild zNacht" | |
/> | |
</div> | |
<div class="wunsch-Text"> | |
<p> | |
Gemütliches Nachtessen <br /> | |
<strong>100 CHF</strong> | |
</p> | |
</div> | |
</div> | |
</li> | |
<li class="wishlist wunsch-container"> | |
<img | |
class="image-wunsch" | |
src="./images/Abendessen.jpg" | |
alt="Bild zNacht" | |
/> | |
<p class="wunsch-Text"> | |
Gemütliches Nachtessen <br /> | |
<strong>100 CHF</strong> | |
</p> | |
</li> |
code/style.css
Outdated
.wishlist { | ||
padding-bottom: 20px; | ||
width: 33%; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To simplify the li
structure as mentioned, you'd have to make the following changes:
.wishlist { | |
padding-bottom: 20px; | |
width: 33%; | |
} | |
.wishlist { | |
flex-direction: column; | |
align-items: center; | |
padding-bottom: 20px; | |
width: 33%; | |
} |
layout adaptations on mobile, mainly for wishlist
try to connect github project with netlify
delete code, as folder is not needed for netlify
PW adapt plz/ort
PW with bullet, type pw, validate enter
proper structure all pages
I created a wedding website with several information about the wedding
I'm struggling with the alignment of the different boxes