我开发的代码完全正常,但由于我使用了calc
函数,有些浏览器不支持它。我不知道如何使用替代品。
我已经看到了一些答案,并尝试使用相对的绝对位置。但是,它们都没有适用于我的场景。
我的代码:
HTML:
<div class="row">
<img height="35" width="35" class="img left" />
<div class="title left">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices orci mauris, sit amet luctus enim sodales id.</div>
<div class="right">
<div class="type"></div>
</div>
<div class="clr"></div>
<div class="desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices orci mauris.</div>
</div>
CSS:
.title{width:calc(100% - 50px);} // 35px of image + 5px margin + 10px of icon
请在此处查看Fiddle。
PS:我只想要CSS解决方案。现在,由于我没有任何解决方案,我使用javascript来调整宽度。
任何帮助将不胜感激。谢谢你的时间。