CSS 3 · Positioning, effects and animation
Crop an image to fit its box
Fill a box with an image without distorting it.
img {
width: 100%;
height: 200px;
object-fit: cover;
}
More positioning, effects and animation commands
- Stick an element while scrolling
- Cover the parent
- Truncate text with an ellipsis
- Limit text to a number of lines
- Animate a change smoothly
- Create an animation
All positioning, effects and animation commands · CSS 3 cheatsheet