javascript - <div> created through jquery not getting styled -

-

i'm trying create grid of square divs using jquery. problem though columns , content created, last column's divs not styled resulting in 0 height/width div.

js

$(document).ready(function() {   (i = 0; < 4; i++) {     var column = $("<div class='column'></div>");     (j = 0; j < 4; j++) {       var unit = $("<div class='unit'></div>");       $('.unit').css("width", (960 / 4));       $('.unit').css("height", (960 / 4));       column.append(unit);     }     $("#container").append(column);   } });

css

#container {   width: 100%;   height: auto;   text-align: center; }  .unit {   background-color: grey;   margin: 1px; }  .column {   display: inline-block; }

html

<body>   <div id="container"></div> </body>

use defined variable unit have created instead $('.unit')

var unit = $("<div class='unit'></div>"); unit.css("width", (960 / 4)); unit.css("height", (960 / 4)); column.append(unit); 

$(document).ready(function() {    (i = 0; < 4; i++) {      var column = $("<div class='column'></div>");      (j = 0; j < 4; j++) {        var unit = $("<div class='unit'></div>");        unit.css("width", (960 / 4));        unit.css("height", (960 / 4));        column.append(unit);      }      $("#container").append(column);    }  });
#container {    width: 100%;    height: auto;    text-align: center;  }  .unit {    background-color: grey;    margin: 1px;  }  .column {    display: inline-block;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="container"></div>


Comments

Post a Comment

Popular posts from this blog

Hatching array of circles in AutoCAD using c# -

-
i beginner in autocad plugins .i have created array of circle using following code. now, have hatch circles in array .how that??how hatch circles @ once? moreover, how can return hatch method , use hatch objects.sorry language.thanks in advance. [assembly: commandclass(typeof(beamsection.class1))] namespace beamsection { public class class1 { //class1 obj = new class1(); [commandmethod("beamatsupport")] public void addlightweightpolyline() { // current document , database document acdoc = application.documentmanager.mdiactivedocument; database accurdb = acdoc.database; promptpointresult ppr = acdoc.editor.getpoint("\nselect starting point "); var ucs = acdoc.editor.currentusercoordinatesystem; point3d startingpt = ppr.value.transformby(ucs); list<double> radius = new list<double>(); radius.add(0.5); ...
Read more

ios - UITEXTFIELD InputView Uipicker not working in swift -

-
hello trying pop uipickerview view programmatically when user clicks on textfield. have tried doesn't doing anything. isn't working. nothing happening when click textfield class userprofiletableviewcontroller: uitableviewcontroller,uitextfielddelegate,uipickerviewdelegate,uipickerviewdatasource { var itempicker: uipickerview! = uipickerview() @iboutlet weak var gendertxtfield: uitextfield! var gender = ["male","female"] override func viewdidload() { super.viewdidload() gendertxtfield.delegate = self itempicker!.delegate = self itempicker!.datasource = self itempicker!.backgroundcolor = uicolor.blackcolor() self.gendertxtfield.inputview = itempicker } func numberofcomponentsinpickerview(pickerview: uipickerview) -> int{ return 1 } // returns # of rows in each component.. func pickerview(pickerview: uipickerview, numberofrowsincomponent component:...
Read more