根据旁边的文本Div调整Image div的大小
根据旁边的文本Div调整Image div的大小
提问于 2016-06-12 13:46:47
我有设计，这需要和图像和文本相互对齐在div(使用column 6)我需要高度图像来调整大小wrt文本div.on平板电脑和移动它有12列布局
这是我的html代码
<div class="row fixed-height">
<div class="col-md-6 full-screen-col img-head"></div><!--col for imag row ends here-->
<div class="col-md-6 cont-bg full-screen-col">
<div class="description_container">
<h1>JOIN OUR TEAM</h1>
<p>We except a lot from our team members, and we give a lot in return- like ongoing training, professional growth
opportunities and competitive benefits. if Gaspar's sounds like your kind of workplace, we'd love to hear from you</p>
</div>
</div><!--container for text details-->
</div><!--row fors slide container -->下面是使用的css。
.fixed-height{
height: 300px;
overflow-y: hidden;
}
.img-head{
background-image: url(../images/Gaspars-Construction-Employee-Photo-1024x683.jpg);
background-size: cover;
height: 100%;
}小小的帮助是非常感谢的。提前感谢
回答 2
Stack Overflow用户
发布于 2016-06-12 14:08:20
这应该是可行的: HTML
<div class="row fixed-height">
<div class="col-md-6 full-screen-col img-head">
<img src="https://dncache-mauganscorp.netdna-ssl.com/thumbseg/308/308116-bigthumbnail.jpg"/>
</div><!--col for imag row ends here-->
<div class="col-md-6 cont-bg full-screen-col">
<div class="description_container">
<h1>JOIN OUR TEAM</h1>
<p>We except a lot from our team members, and we give a lot in return- like ongoing training, professional growth opportunities and competitive benefits. if Gaspar's sounds like your kind of workplace, we'd love to hear from you</p>
</div>
</div><!--container for text details-->
</div><!--row fors slide container -->CSS
.img-head{
float: left;
}Stack Overflow用户
发布于 2016-06-12 14:17:39
加上这个，
<div class="row fixed-height">
<div class="col-md-6 col-sm-6 full-screen-col img-head"></div><!--col for imag row ends here-->
<div class="col-md-6 col-sm-6 cont-bg full-screen-col">
<div class="description_container">
<h1>JOIN OUR TEAM</h1>
<p>We except a lot from our team members, and we give a lot in return- like ongoing training, professional growth
opportunities and competitive benefits. if Gaspar's sounds like your kind of workplace, we'd love to hear from you</p>
</div>
</div><!--container for text details-->
</div><!--row fors slide container -->页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37771107
复制相关文章
相似问题
腾讯云开发者
