0
イメージがDIV1に含まれ、テキストがDIV2に含まれているとします。 Div1とDiv2の両方が浮動小数点ですLeft.Soパディングされた画像を非表示にしたいと思います。 DIV2の内容は動的なので、どのdivでも高さを設定したくありません。 偶数ボックスサイズ:このコードまたはブラウザでは、パディングボックスは機能しませんでした。 モニタースタンドトリミングにより、画像の下などのように私の欲望出力: 画像のメインコンテナdivをパディング/マージンすることなく、divのパディング/マージン画像の部分を隠す方法はありますか?
.monitor-area
{
\t background:#ebebeb;
\t height:auto;
}
.monitor-area:after
{
\t content:'';
\t display:block;
\t clear:both;
}
.monitor
{
\t width:50%;
\t float:left;
\t overflow:hidden;
}
.monitor img
{
\t width:100%;
}
.monitor-content
{
\t width:44%;
\t overflow:hidden;
\t float:right;
\t padding-right:2%;
}
.monitor-title
{
\t margin-top:80px;
}
.monitor-title h1
{
\t color:#333333;
\t font-size:30px;
\t font-weight:normal;
\t text-transform:uppercase;
}
.monitor-text
{
}
<section class="monitor-area">
\t <div class="monitor">
\t <img src="https://image.ibb.co/ioQ47Q/monitor.png" alt="448*250px" />
\t </div>
\t <div class="monitor-content">
\t \t <div class="monitor-title">
\t \t <h1>A CATCHY TITLE</h1></div>
\t \t
\t \t <div class="monitor-text">
\t \t <p>Cursuspenatisaccum ut curabitur nulla tellus tor
\t \t ames a in curabitur pede. Idet mollisi eros dis orci
\t \t congue elis et curabitur consequam intesque.
\t \t Curabiturpisametur in ante.</p>
\t \t </div>
\t \t <div class="monitor-button">
\t \t <a href="">read more
\t \t <i class="fa fa-angle-double-right"></i>
\t \t </a>
\t \t </div>
\t </div>
</section>
は何を理解するために、簡単な言葉で、そのハードを教えてくださいちょうどあなたがほしい – Muhammad
ちょうど2つの画像を参照してください。私は最後の画像のような出力は、モニターの下部を隠すことによって期待しています。 –