html - Bootstrap 3 float layout -


i have problem creating relative simple layout. use bootstrap 3 not must.

so, html:

<div class="container">     <div class="row">         <div class="col-md-4">             <p>a</p>             <p>a</p>         </div>         <div class="col-md-8">             <p>b</p>         </div>         <div class="col-md-4">             <p>c</p>         </div>         <div class="col-md-8">             <p>d</p>             <p>d</p>             <p>d</p>         </div>     </div> </div> 

and visual purpose, css:

div.col-md-4, div.col-md-8 { border: 1px solid red; } 

i want on medium screens (md) layout (no matter of height , without white spaces between them):

a b c d 

on small screens (sm) kind of layout:

a b c d 

jsfiddle link: http://jsfiddle.net/hxz35/2/

thank you!

is looking for?

http://jsfiddle.net/hxz35/5/  <div class="container"> <div class="row">     <div class="col-md-4">         <p>a</p>         <p>a</p>     </div>     <div class="col-md-8">         <p>b</p>     </div>     <div class="col-md-4 a">         <p>c</p>     </div>     <div class="col-md-8 d">         <p>d</p>         <p>d</p>         <p>d</p>     </div> </div> 

and css

div.col-md-4, div.col-md-8 { border: 1px solid red; } .a {clear: left;} .d{float: initial; overflow:hidden;} @media , (min-width: 992px) { .pull-right-lg { float: right !important; }  } 

Comments

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

google shop client API returns 400 bad request error while adding an item -