0

I'm trying to insert an interactive plot using <embed src="..."></embed> and make it responsive with bootstrap. Works fine but I want to reduce the max size of the chart and I can't find a solution. This is the working (but huge) plot:

<div class="embed-responsive embed-responsive-4by3">
    <embed src="{{payment_methods_plots[account]}}"></embed>
</div>

My three failed approaches are:

  1. Putting inside a div and style it with CSS style="max-height: ...px;": Cut the image by half.
  2. Use the height property of <embed>: Not working.
  3. Trying to add the CSS property (max-height: ...px;) to embed-responsive-4by3: Failed.

EDIT: The charts are dynamic charts generated by pygal python library (codified in base64 ). This is an example of a graph:

https://jsfiddle.net/e6L5oLxe/

Juan David
  • 2,676
  • 4
  • 32
  • 42

1 Answers1

-1

Try use !important in embed-responsive-4by3 and take a look at his parent and set max-height there.

If none of these solutions work, please provide to us a jsFiddle or plunker example.

Yuri Pereira
  • 1,945
  • 17
  • 24