我试过用类和id在CSS中改变一些东西,但是似乎没有什么能使这两个图像都在屏幕的远端(最左边的徽标和最右边的配置文件)。尝试了很多不同的东西,如text-align和不同的justify-contents,但似乎没有任何工作。代码如下:第一个
text-align
justify-contents
ijxebb2r1#
justify-content现在什么都不做,因为它是在一个没有display:flex的div上设置的。如果你想把有图像的div分开,那么把justify-content:space-between放在有图像的div上,也就是top-nav div。
jdgnovmf2#
显而易见的答案是设置top-nav div元素(<img>元素的父元素)的flex-item以扩展来填充可用空间;这意味着<div>元素将填充该空间,并且<img>元素将通过浏览器定义的语言的默认text-align对齐。相反,你可以删除<div〉元素,因为它们对HTML没有什么帮助,而且毫无理由地膨胀了HTML,然后在.top-nav元素上指定justify-content: space-between:第一个或者,您可以保留<div>元素,而只省略flex-grow陈述式:第一次或者直接在这些<div>元素上使用text-align:第一个参考文献:
top-nav div
<img>
<div>
<div
.top-nav
justify-content: space-between
flex-grow
display
justify-content
snvhrwxg3#
寻找与此类似的结果?第一个
3条答案
按热度按时间ijxebb2r1#
justify-content现在什么都不做,因为它是在一个没有display:flex的div上设置的。如果你想把有图像的div分开,那么把justify-content:space-between放在有图像的div上,也就是top-nav div。
jdgnovmf2#
显而易见的答案是设置
top-nav div
元素(<img>
元素的父元素)的flex-item以扩展来填充可用空间;这意味着<div>
元素将填充该空间,并且<img>
元素将通过浏览器定义的语言的默认text-align
对齐。相反,你可以删除
<div
〉元素,因为它们对HTML没有什么帮助,而且毫无理由地膨胀了HTML,然后在.top-nav
元素上指定justify-content: space-between
:第一个
或者,您可以保留
<div>
元素,而只省略flex-grow
陈述式:第一次
或者直接在这些
<div>
元素上使用text-align
:第一个
参考文献:
display
。justify-content
中的一个。text-align
。snvhrwxg3#
寻找与此类似的结果?
第一个