Note that there are some explanatory texts on larger screens.

plurals
  1. POwhy <div> after being dragged is not responsive?
    primarykey
    data
    text
    <p>i use bootstrap, and when i drag some element, this is out of responsibility, this means when you re-size browser that element has been dragged is not responsive.</p> <p><a href="http://jsfiddle.net/prince4prodigy/XzLpK/" rel="nofollow">jsfiddle</a></p> <pre><code>&lt;!DOCTYPE &gt; &lt;head&gt; &lt;style&gt; #container { position:relative; background-color:#f5af69; border:1px solid #643506; height:400px; } .item { position:absolute; width:25px; height:25px; background-color:#ffef2d; border:1px solid red; text-align:center; line-height:25px; } #div1 { left:10%; top:10%; } #div2 { left:35%; top:80%; } #div3 { left:75%; top:30%; } #div4 { left:50%; top:50%; } .hover { opacity:0.4; } .active { background-color:#fa58fe; } #line { width:100%; height:3px; background-color:#342903; top:50%; position:absolute; } #line2 { width:3px; height:100%; background-color:#342903; left:50%; position:absolute; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="container" class="container-container-fluid"&gt; &lt;div class="row-fluid"&gt; &lt;div id="main" class="span5"&gt; &lt;div id="div1" class="item drag drop"&gt;1&lt;/div&gt; &lt;div id="div2" class="item drag drop"&gt;2&lt;/div&gt; &lt;div id="line"&gt;&lt;/div&gt; &lt;div id="line2"&gt;&lt;/div&gt; &lt;div id="div3" class="item drag drop"&gt;3&lt;/div&gt; &lt;div id="div4" class="item drag drop"&gt;4&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="test"&gt;&lt;/div&gt; &lt;/body&gt; &lt;script type="text/javascript" language="javascript"&gt; $(function() { $( ".drag" ).draggable({ containment : '#container', tolerance: 'touch', }); }); &lt;/script&gt; </code></pre> <p>how can resolve this problem with bootstrap classes or @media-query?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload