Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: jQuery
hi friends
 
i added div for while clicking the addbutton but not fixed the position.can any one help me.
<div id="divContent" style="border: solid 3px gray; height: 450px; width: 100%;">
                        <div id="divSubContent" style="border: solid 1px gray; width: 15%; height: 100%;">
                            <div id="divSubContent1" style="border: solid 1px gray; width: 100%; height: 50px;">
                                &nbsp;
                            </div>
                            <div id="divSubContent2" style="border: solid 1px gray; width: 100%; height: 395px;">
                                &nbsp;
                            </div>
                        </div>
                    </div>
 

$(document).ready(function() {
           new_div = "<div  style='border: solid 1px gray; width: 15%; '><div style='border: solid 1px gray; height: 50px;'>&nbsp;</div> <div  style='border: solid 1px gray; height: 395px;'>&nbsp;</div></div>";
           $("#aBAddClnBtn").click(function() {
 
               $("#divContent").append(new_div);
               //                alert($("#divContent").html());
               return false;
           });
       });
Posted 23-Jan-13 0:05am
Comments
Azziet at 23-Jan-13 5:49am
   
please be clear with your question??
keerthana.k at 23-Jan-13 8:14am
   
i have div inside another div if i click the addnnewbutton the div is place outside the parent div .please help me its very urgent
Hariharan Arunachalam at 27-Jan-13 16:50pm
   
You are almost recreating the whole div? or are you trying to 'add a row to a table' effect on button click? A little context would be helpful!
vbmike at 28-Jan-13 13:45pm
   
Try using the html(); method to add your new div's "inside" the div you want it to be inside. Append will only "add" stuff after the div you identify.

1 solution

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Try below..

$("#divContent").append(new_div).css( { "position":"relative" , "float":"left" , "top":"10px" , "padding":"5px" });

...
 

Also you can generate unique id's for newly added div's dynamically and write css for those div's containing positioning...
 
Ex
 
<style type="text/css">
#div1
{
 position:relative;
 float:left;
 height:100px;
width:100px;
padding:5px;
border:solid 1px silver;
 
}
#div2
{
 position:relative;
 float:left;
 height:50px;
width:50px;
padding:5px;
border:solid 1px silver;
 
}
</style>
  Permalink  
v2
Comments
vinodkumarnie at 2-Feb-13 2:43am
   
While down voting state reason's first..

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



Advertise | Privacy | Mobile
Web03 | 2.8.1411023.1 | Last Updated 1 Feb 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100