How to avoid top space and make full dimension in justgage?

Question

Is there any option to avoid top space. Actually I am looking solution to show as full width and full height.

enter image description here

var g = new JustGage({
  id: "spedometer",
  title: "Monthly expense",
  value: 1986, 
  min: 0,
  max: 2450,
  shadowOpacity: 0,
  relativeGaugeSize: true
});

@JustinC css solution effecting responsive :( please have a look fiddle demo http://jsfiddle.net/ugFmE/11/ — Mo., Mar 15 '14 at 00:48

score 5 · Answer 1 · answered Apr 22 '14 at 17:53

5

Add some css to the div to make it go up...

#spedometer{ 
    margin-top: -##px 
}

where '##' is the amount of pixels you would like to move the div towards the top..

demo http://jsfiddle.net/ugFmE/17/

answered Apr 22 '14 at 17:53

jcruzz92

473
4
10

By now this is the only way to go. Given the fact that the creator said, eleven months ago, that the option to hide the title was on the works... and still nothing. This is not the best solution for responsiveness sake, but does the trick.. here: https://github.com/toorshia/justgage/issues/60 – jcruzz92 Apr 22 '14 at 18:09
You can make it work responsively by using % instead of px: #speedometer { margin-top: -20%; } – adalle Jun 16 '18 at 00:10

score 1 · Answer 2 · answered Apr 26 '14 at 18:32

Use style attribute of div tag and change value of top-margin to negative. I hope that would help you

<div id="g1" style= margin-top:-100px;></div>

window.onload = function () {
    var g1 = new JustGage({
        id: "g1",
        value: getRandomInt(0, 100),
        min: 0,
        max: 100,
        relativeGaugeSize: true
    });
}

How to avoid top space and make full dimension in justgage?

2 Answers2