CODEWITHSUNDEEP
javascripthtmlcssheight
BrAt Maria
BrAt Maria

Reputation: 67

How to override element.style height

I am trying to change the height of a div in a calendar that I haven't written by myself. In firebug I see this for css:

element.style {
        height: 744px;
        width: 1463px;
        left: 0px;
        top: 81px;
       }

I have read that this will always override css and that it is a result from a js file. I tried to find the file with grep but I can't find it. I also tried to override divs height inside the html page like this:

  <style type="text/css">
      .dhx_cal_data p{
            height:900px !important;

          }

      .dhx_cal_data {
            height:900px !important;

       }

       #dhx_cal_data {
             height:900px !important;

        }

Html : 

 <div class="dhx_cal_data" name="dhx_cal_data" id="dhx_cal_data" style="height:900px;">
                    <p class="para1">

  </div>

And also i tried to override it with javascript like this: 

<script >

$(document).ready(function(){


var obj = document.getElementById('dhx_cal_data');
obj.style.height = "900px";
document.getElementById("dhx_cal_data").style["height"] = '900px';
 })
</script>

But nothing is working. Do you know how I can change it? Or maybe how I can find the file that creates this element.style?

Upvotes: 3

Views: 6002

Answers (2)

Longblog
Longblog

Reputation: 849

It's a total hack, but you could write your own jQuery function that redefines the height after the unknown javascript file does. Just put the jQuery code before the closing body tag. Granted, this is a terrible practice and should only be used if all of your other efforts fail.

Upvotes: 1

Tarwirdur Turon
Tarwirdur Turon

Reputation: 781

  1. Use !important before ;.

  2. See: http://jsfiddle.net/ahfo9cfc/1/ - JS works

Upvotes: 0

Related Questions