Override css using jQuery

Question

Using jquery can td width be overwritten as shown

<table>
<tr>
<td width="30%"></td>
<td width="70%" id="description"></td>
</tr>
</table>

<script>
 $("#description").css({"width":"30%"})
</script>

Your HTML is not valid (missing <tr>) and you don't have an id set on the table cell for the jQuery code to work. — Klemen Slavič
– Klemen Slavič, Commented Dec 9, 2010 at 11:14

rahul · Accepted Answer · 2010-12-09 11:32:49Z

1

Put all your jQUery code inside document ready event.

$(function(){
     $("#description").removeAttr("width").css({"width":"30%"});
});

width should be set inside style and not as an attribute. First remove the attribute and then set the style. If you can use a class then it will be the best approach.

.elwidth
{
    width: 30%;
}

 $(function(){
         $("#description").removeAttr("width").addClass("elwidth");
 });

answered Dec 9, 2010 at 11:32

rahul

188k50 gold badges239 silver badges266 bronze badges

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

Comments

Klemen Slavič · Accepted Answer · 2010-12-09 11:16:56Z

0

Short answer: yes.

<table>
  <tr>
    <td id="firstCell" width="30%">...</td>
    <td id="secondCell" width="70%">...</td>
  </tr>
</table>

<script>
  $("#firstCell").attr("width", "40%");
  $("#secondCell").attr("width", "60%");
</script>

Although you shouldn't be using width attributes, rather use CSS properties to set the widths of table cells.

answered Dec 9, 2010 at 11:16

Klemen Slavič

19.9k3 gold badges36 silver badges44 bronze badges

Collectives™ on Stack Overflow

Override css using jQuery

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related