我试图让粉红色的div宽度只与它里面的文本一样宽,而不是延伸到最后。宽度设置为auto,我认为这只会使它足够大,以适应文本。
如果没有一个固定的div大小,该如何修复这个问题?
谢谢你的帮助
#footer-right{
float:left;
width:360px;
height:200px;
background:#96F;
}
.footer-text-section-wrap{
background:#f0f;
width:auto;
height:auto;
}
footer-1{
color:#333;
font-weight:100;
font-family:verdana,arial,"Times New Roman", Times, serif,georgia,serif,helvetica;
font-size:20px;
border-bottom:1px solid #ccc;
padding:0 0 10px 0px;
}
<div id="footer-right">
<div class="footer-text-section-wrap">
<footer-1>Get a Quote</footer-1>
</div>
</div>
5条答案
按热度按时间pexxcrt21#
使用
inline-block
pw136qt22#
<footer-1>
标签是invalid markup,应该替换为<footer class="footer-1">Get a quote </footer>
,然后修改您的css以使用.footer-1
正如其他人所说的那样,使用inline-block使其显示为自动宽度
您可以阅读更多关于display css here
hivapdat3#
使其成为一个内联元素将使其自身大小与您的文本大小一致。
kkbh8khc4#
这个css将做你所要求的原因宽度:auto不能正常工作是因为父div有固定的宽度,并且默认情况下div有display:块,它会给子div父div的宽度。因此显示:inline-block也可以工作,如果不比在子元素上放置固定宽度更好的话。
yvt65v4c5#
将
display:inline-block;
应用于footer-text-section-wrap。将其宽度设置为自动。