У меня заголовок и изображение, которое должно быть горизонтально выложено на абсолютно позиционированном div. Я показываю текст в subdiv с фиксированной шириной. Я пытаюсь скрыть изображение, если оно не помещается в абсолютно позиционируемый контейнер с помощью CSS3, но я не могу. Я знаю, что это возможно с JS, но, возможно, есть способ CSS3?
.container {
display: -ms-flexbox;
-ms-flex-direction: row;
-ms-flex-pack: justify;
overflow-x: hidden;
position: absolute;
left: 60px;
right: 60px;
bottom: 0px;
height: 400px;
}
.part-one {
left: 0px;
bottom: 100px;
width: 300px;
font-size: 22pt;
color: white;
min-width: 300px;
}
.part-two {
max-width: 400px;
width: 400px;
min-width: 50%;
}
.header {
font-size: 50pt;
color: blue;
margin-bottom: 10px;
}
<div style="position: relative; width: 500px; height:500px;">
<div class="container">
<div class="part-one">
<h1 class="header">This is some header</h1>
</div>
<div class="utilizationContainer" class="part-two">
<img src="">
</div>
</div>
</div>