gpt4 book ai didi

HTML5、CSS : Make FA icon and link break correctly on mobile

转载 作者:太空宇宙 更新时间:2023-11-04 07:33:10 24 4
gpt4 key购买 nike

当第一行在移动设备中中断时,我想让第二行从第一行开始的地方开始。有什么想法可以在列表中达到这个目的吗?

代码笔:https://codepen.io/altos/pen/KoKEba

<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<body>
<ul>
<li>
<a href="#">
<i class="fa fa-download"> </i>
<span class="file-title">Link 1 - Lorem ipsum dolor sit amet, consetetur sadipscing elitr </span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-download"> </i>
<span class="file-title">Link 2 - Lorem ipsum dolor sit amet, consetetur sadipscing elitr </span>
</a>
</li>
</ul>
</body>

最佳答案

display 属性赋予 a 以在同一行中断

ul li a {
display: flex;
}

关于HTML5、CSS : Make FA icon and link break correctly on mobile,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49191910/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com