javascript - Image not respecting max-height in Firefox -


portrait img contained within div not it's height set correctly... in ff(27.0.1) only. works chrome, , ie8.

i have following:

html, body {   margin: 0;   border: 0;   padding:0;   width: 100%;   height: 100%;   overflow:hidden; } .photo-container {   position: absolute;   right: 0;   top: 0;   width: 79%;   height: 100%;   overflow-y: auto; } img#photo {   margin-top: 0.5%;   max-width: 100%;   max-height: 95%; } 

in html...

<div class="photo-container">   <div id="pic"></div> </div> <script type="text/javascript">     function f_pop(theimg) {       document.getelementbyid('pic').innerhtml = "<img id='photo' src='" + theimg + "' alt='photo'>";     } 

http://jsfiddle.net/isherwood/sfzgn

notes:

  • the photograph portrait orientation.
  • this works chrome , ie8, not in ff 27.0.1
  • in img#photo, changed height 50%. chrome , ie8 sized photo down. in ff truncated (and required div's scroll bar move down).

i had (without photo-container) page in frameset, hierarchy body, div id=pic. worked in design ff. converted frameset single page 2 column (divs), right side being photo-container, , not work in ff.

your appreciated.

thanks.

you need set height on #pic:

#pic {     height: 100%; } 

http://jsfiddle.net/isherwood/sfzgn/2/


Comments

Popular posts from this blog

Android layout hidden on keyboard show -

google app engine - 403 Forbidden POST - Flask WTForms -

c - Why would PK11_GenerateRandom() return an error -8023? -