Responsive Bild und Text nebeneinander

Question

Ich versuche, 2 Spalten zu machen:

Das erste ist ein Bild 50% der Seite zu nehmen und die andere wären ein Textfeld unter dem restlichen 50% der Seite sein . Keine Ränder.

Ist es möglich, so etwas zu haben, das reagiert? Ich bemühe mich, die Hintergrundfarbe an das Bild anzupassen.

.imagebox { 
 
    width: 50%; 
 
    float: left; 
 
} 
 

 
.textbox { 
 
    width: 50%; 
 
    float: right; 
 
    text-align: center; 
 
    padding-top: 20px; 
 
    background-color: #666; 
 
    color: #fff; 
 
}

 
<div class="imagebox"> 
 
<img src="http://www.mokshasoulyoga.com/wp-content/uploads/2017/04/5.png" width="100%" height="auto" /> 
 

 
</div> 
 

 

 
<div class="textbox"> 
 

 
    <h2>Title Here</h2> 
 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> 
 
    <a href="#">Read More</a> 
 

 
</div>

Answer 1

Hier die erste Hälfte ist ein <img> und das zweite ist ein <textbox>

https://jsfiddle.net/b8ow0noy/1/

Der Code aus dem Link hier ist

<div style="width: 50%; float:left"> 
<img src="https://www.w3schools.com/css/trolltunga.jpg"> 
</div> 

<div style="width: 50%; float:right"> 
<textbox> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    #right content in there<br> 
    </textbox> 
</div> 

css:

div{ 
    margins:0 px; 
    overflow:hidden; 
}