HOW TO PLACE 3 DIVS SIDE BY SIDE AND MAKE THEM RESPONSIVE (WITHOUT BOOTSTRAP) ?

7.47K viewsProgrammingbootstrap css responsive twitter web
0

HOW TO PLACE 3 DIVS SIDE BY SIDE AND MAKE THEM RESPONSIVE (WITHOUT BOOTSTRAP) ?

Answered question
0
<style>
.button-margin {
 margin-top:-5%;
 width:100%;
}
 @media only screen and (min-width: 768px) {
 .position-span-2 {
  margin-left: 2%;
  padding-left: 5%;
 }
}
 @media only screen and (min-width: 480px) {
  .div_1_of_3 {
  width: 52%;	
 }
  .div_2_of_3 {
  width: 22%;
 }
      .col {
  display: block;
  float: left;
  margin: 1% 0 1% 1.6%;
 }
  .col:first-child {
  margin-left: 0;
 }
}
</style>
 <meta name="viewport" content="width=device-width,initial-scale=1" />
<div class="container">
    <div class="col div_1_of_3 " style="margin-top:25px;">Wed 24 August 2016 , 9.00am to 12.00pm</div>
    <div class="col div_2_of_3 " style="margin-top:25px;">Tickets from $65</div>
    <div class="col div_2_of_3 " style="margin-top:25px;"><button>Find out more</button></div>
</div>


JSFiddle here

Changed status to publish
Write your answer.

Categories