JQuery - Dynamically created element css not working

Question

I have created a table dynamically using JQuery. But I cant able to apply css for the created table column. Here the sample link in codepen codepen.

I want set width:100px for 1st column. Plese help me in this. Thanks in advance...

jfplataroti · Accepted Answer · 2015-03-26 16:45:11Z

3

actually you can modify the way that you are defining the width of the columns, like:

td.time-cell{
  width: 100px;
  min-width: 100px;
}
td.drop{
  width: 100%;
}

in this way you can ensure that the first column is only 100px and the other one will expand.

answered Mar 26, 2015 at 16:45

jfplataroti

6614 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:50:53Z

2

Remove #patientApptTable width:100%;

#patientApptTable {
  border-spacing: 0;
  width:100%; // remove this line
  border-collapse:collapse;
}

Also, it is not valid to insert <div> into <tr>.

CommunityBot

11 silver badge

answered Mar 26, 2015 at 16:40

Danijel

12.8k5 gold badges43 silver badges57 bronze badges

Omer Bokhari · Accepted Answer · 2015-03-26 16:47:24Z

0

set the width of the column heading instead

#patientApptTable th:first-child{
    width: 100px !important;
}

answered Mar 26, 2015 at 16:47

Omer Bokhari

60k12 gold badges46 silver badges60 bronze badges