Extra scrollbar on modal form & layout


#1

http://www.surplusanywhere.com/surplusAnywhere7

I have a modal form set to
height left right width top to auto
on the form I have a container set to
height left right top to auto width 100%
inside the container I have a HTMLview set to
height left right top to auto width 100%
overflow auto
scrolling true
On the form show I have

        HTMLdetails.Height = formDetails.Height -60;
        console.log(' contDetails.Height ='+ contDetails.Height);
        HTMLdetails.innerHTML = notesForEditor ;
        setTimeout(HTMLdetails_ref.refresh(),100);

I need to contain the HTMLview within the container ( so when the client scrolls he still sees the ‘x’ to close the form)

Click on deals
click on 'click to show deal’
This Shows a modal form.

  1. I would have thought the form would be within the window ( it expands down slightly)
  2. On mobile the scrolling is okay
  3. On desktop I see an extra scrollbar ( seems to be on the container)
  4. I cannot get the HTMLview to auto size in the container. Above code / padding etc not getting the desired effect.
  5. When rotated on mobile the formatting / scrolling screws up. I tried
    window_onorientationchange=function(){
    HTMLdetails.Height = formDetails.Height -60;
    console.log(' contDetails.Height ='+ contDetails.Height);
    setTimeout(HTMLdetails_ref.refresh(),100);
    } 

Whats the 'magic formula to get this to work?