Du könntest sogar min-width und max-width verwenden, um einzuschränken wie klein oder groß das Bild wird.
Layouten mit CSS
Prozent ist eine Maßeinheit relativ zum umgebenden Block. Es ist großartig für Bilder: hier machen wir ein Bild das immer 50% so breit ist wie sein Container. Mach das Browserfenster kleiner und schau, was passiert!
article img {
float: right;
width: 50%;
}
Du könntest sogar min-width und max-width verwenden, um einzuschränken wie klein oder groß das Bild wird.
Du kannst Prozent für Layouts verwenden, aber das braucht mehr Arbeit.In diesem Beipiel bricht der Inhalt von nav unbefriedigend um, wenn es zu schmal wird. Es kommt immer darauf an, was am besten mit deinem Inhalt funktioniert.
nav {
float: left;
width: 25%;
}
section {
margin-left: 25%;
}
Wird das Layout zu schmal, wird nav zerquetscht. Noch schlimmer ist, dass du nicht min-width verwenden kannst, um das zu vermeiden, weil die rechte Spalte sich nicht daran halten würde.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum, nisi lorem egestas odio, vitae scelerisque enim ligula venenatis dolor. Maecenas nisl est, ultrices nec congue eget, auctor vitae massa. Fusce luctus vestibulum augue ut aliquet. Mauris ante ligula, facilisis sed ornare eu, lobortis in odio. Praesent convallis urna a lacus interdum ut hendrerit risus congue. Nunc sagittis dictum nisi, sed ullamcorper ipsum dignissim ac. In at libero sed nunc venenatis imperdiet sed ornare turpis. Donec vitae dui eget tellus gravida venenatis. Integer fringilla congue eros non fermentum. Sed dapibus pulvinar nibh tempor porta. Cras ac leo purus. Mauris quis diam velit.
</section>