我一直在寻找以下问题的答案:
我有两个问题:
1. 在下面的图片中,文本的左边和右边有两个div,设置下边框和左/右边框很简单,但是我找不到如何缩短上边框的方法. 2、如何才能让它们像下图一样左右浮动?它们所在div被设置为Display Flex,因此浮动不起作用
下面的Html
.divss {
display: flex;
justify-content: space-between;
flex-direction: column;
align-items: center;
margin-top: 40px;
line-height: 2px;
background: #bbb;
}
.small {
font-family: futuraptdemi;
font-size: 15px;
letter-spacing: 1.5px;
}
.big {
font-family: futuraptdemi;
font-size: 50px;
}
.semisquarel {
width: 135px;
height: 135px;
border-top: white solid 2px;
border-left: white solid 2px;
border-bottom: white solid 2px;
border-right: none;
}
.semisquarer {
width: 135px;
height: 135px;
border-top: white solid 2px;
border-left: none;
border-bottom: white solid 2px;
border-right: white solid 2px;
}
<div class="divss">
<div class="semisquarel"></div>
<img src="images/Path 16.png" width="37px" height="50px"></br>
<p class="small">BEVERAGES</p>
<p class="big">PRODUCT</p>
<p class="small">RUM, WHISKEY, VODKA AND MORE</p>
<p class="big">RANGE</p>
<div class="semisquarer"></div>
</div>