aligning the first and last flex items to the left and right respectively
给出以下HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 | <img src="http://www.3tonus.com/2014/images/gallery/tower/thumbs/finalfull.jpg" /> <img src="http://www.3tonus.com/2014/images/gallery/tower/thumbs/finalfull.jpg" /> <img src="http://www.3tonus.com/2014/images/gallery/tower/thumbs/finalfull.jpg" /> <img src="http://www.3tonus.com/2014/images/gallery/tower/thumbs/finalfull.jpg" /> <img src="http://www.3tonus.com/2014/images/gallery/tower/thumbs/finalfull.jpg" /> |
和css
1 2 3 4 5 6 7 | div.banner.row.images { display: flex; flex-wrap: wrap; } div.banner.row.images div { flex: 1 1 auto; } |
如何使第五张图像正确对齐,以使所有占用的空间都位于柔韧性框的中间。
我尝试了
我要使第一张图像左对齐,最后一张图像右对齐,并在它们之间留出空间,或者只是让图像增长以填充该空间。
只在这里
引导程序中的
元素
1 2 3 4 | div.banner.row.images::before, div.banner.row.images::after { content:none; } |
,然后删除
图像将在没有默认容器填充的情况下左右对齐。如果要使用此填充,只需删除