html - responsive 3 div side by side with image -


Div inside div and div div inside DIV. Trying to leave the float, but not working

For a quick overview
here is the CSS:

 . Container {Clear: Both; Padding: 0 pixels; Margin: 0 px; Hidden flurry; } .profile1 {background-color: #ccf; } .profile2 {background-color: #cfc; } .profile3 {background color: # FCC; } @ Media only screen and (minimum-width: 480px) {.span_1_of_3 {width: 32.2%; } .col {display: block; Swim left; Margin: 1% 0 1% 1.6%; } .col .: First-child {margin-left: 0; }}  


HTML:

  & lt; Div class = "container" style = "border: 2px solid black;" & Gt; & Lt; Div class = "col span_1_of_3 profile1" & gt; & Lt; Img src = "http://placehold.it/100x100" /> Advertisement for the website & lt; / Div & gt; & Lt; Div class = "col span_1_of_3 profile2" & gt; & Lt; Img src = "http://placehold.it/100x100" /> Advertisement for the website & lt; / Div & gt; & Lt; Div class = "col span_1_of_3 profile3" & gt; & Lt; Img src = "http://placehold.it/100x100" /> Advertisement for the website & lt; / Div & gt; & Lt; / Div & gt;  

Image floating on the right looks okay:.

  .col & gt; IMG {float: left; }  

Comments

Popular posts from this blog

java - org.apache.http.ProtocolException: Target host is not specified -

java - Gradle dependencies: compile project by relative path -

ruby on rails - Object doesn't support #inspect when used with .include -