高度未知的垂直对齐内容

时间:2018-12-14 19:54:12

标签: html css centering

目前我有类似以下内容:

var q1 = 12;
var q2 = 13;
var q3 = 12;
var q4 = 22;
var q5 = 99;
var q6 = 100;
var q7 = 62;
var q8 = 99;
var q9 = 12;
var q10 = 99;

if (q1 == q2) || (q1 == q3) || (q1 == q4) || (q1 == q4).....{
       //do something
}

if (q2 == q3) || (q2 == q4) || (q2 == q4).....{
       //do something
}

if (q3 == q4) ||....

和CSS:

<div class="wrapper">
    <div id="imageWrapper">
      <img src="https://picsum.photos/200/300?image=0" alt="" width="100%"> 
    </div>
    <div class="contentWrapper">
      <div class="title">
        sample
      </div>
            <div class="summary">
        sample
      </div>
    </div>
</div>

我正在尝试垂直对齐文本内容,但它拒绝垂直对齐。我不想在图像上设置任何高度,因为不想破坏它的宽高比,但需要使内容始终与所有屏幕尺寸的剩余空间对齐。

下面是一个jsfiddle: https://jsfiddle.net/a4n7drxf/

任何有关如何实现这一目标的想法将不胜感激

0 个答案:

没有答案