javascript - css overflow-y:auto not working in firefox and chrome -


i have following code 

<div id="somediv" style="float: right; margin-right: -350px; position: relative; overflow-x: hidden; overflow-y: auto;"> <svg class="somesvgclass" width="105"> <g>..</g> <g>..</g> ... </svg> </div>

this div contains inside div fixed height.these "g" elements added dynamically using javascript. expect scroll bar when no of "g" elements increased

in ie11 able see scroll bar when no of "g" elements high. same no of elements not able see scroll bar in firefox , in chrome please tell me gone wrong here
here sample fiddle

i'm not svg expert, never used it, seems svg doesn't change height. if set height svg works: http://jsfiddle.net/u5ymhmht/7/

the practical solution in js when add line, add height of line svg.

p.s. sorry previous misunderstanding.

svg {      height:500px;  }    #someid {      height: 150px;      overflow-x: hidden;      overflow-y auto;  }
<div id="someid">      <svg  width="105">      <g transform="translate(10,5)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,20)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,35)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,50)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,65)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,80)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>                    <g transform="translate(10,95)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,110)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>                    <g transform="translate(10,125)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,140)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>                    <g transform="translate(10,155)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,170)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,185)">          <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>          <g transform="translate(10,200)">              <text style="fill: black;" dy=".35em" y="5" x="15">asdsd</text>          </g>      </svg>  </div>


Comments

Post a Comment

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

i working on custom magento extension. working around adminhtml part , i've created custom form there. here form code: <?php class vivasindustries_smsnotification_block_adminhtml_sms_sendmass_edit_form extends mage_adminhtml_block_widget_form { public function _preparelayout() { $extensionpath = mage::getmoduledir('js', 'vivasindustries_smsnotification'); $head = $this->getlayout()->getblock('head'); $head->addjs('jquery.js'); $head->addjs('vivas.js'); return parent::_preparelayout(); } protected function _prepareform() { $form = new varien_data_form(array( 'id' => 'edit_form', 'action' => $this->geturl('*/*/save', array('id' => $this->getrequest()->get...
Read more

spring cloud - How to configure SpringCloud Eureka instance to point to https on non standard port -

i using spring boot/cloud actuator, , annotate application class @enableeurekaclient, applications comes , registers correctly eureka server. however, because configure application run on https, , on port 8444, eureka instance not registered correct protocol, instead using http. example http://localhost:8761/eureka/apps/ gives me <homepageurl>http://localhost:8444/</homepageurl> <statuspageurl>http://localhost:8444/info</statuspageurl> <healthcheckurl>http://localhost:8444/health</healthcheckurl> there no such thing securehomepageurl or securestatuspageurl - securehealthcheckurl exists. check com.netflix.appinfo.eurekainstanceconfig properties transmitted server when eureka client registers. however, having home/status/health page urls not showing https protocol doesn't mean instance isn't registered. matters whether or not secure port enabled. check following properties in client configuration: eureka.instance.se...
Read more

javascript - Bootstrap Popover: iOS Safari strange behaviour -

i looking through twitter bootstrap documentation, , i'm interested in implementing dismissible popover when button clicked. here example bootstrap's docs: http://getbootstrap.com/javascript/#dismiss-on-next-click when press "dismissible popover" button os x safari browser works fine. when access same link above ios safari, button not work. is, popover not dismissed on click. why button not working ios safari? the example linked using data-trigger="focus" attribute. try changing data-trigger="click" . <a tabindex="0" class="btn btn-lg btn-danger" role="button" data-toggle="popover" data-trigger="click" title="dismissible popover" data-content="and here's amazing content. it's engaging. right?">dismissible popover</a>
Read more