Stack Overflow
Stack Overflow

Consistently sizing a – Eric Mar 04 '11 at 16:59

  • The ASP.Net Textbox is an on the page not a – Shawn Apr 10 '11 at 15:48
  • @Shawn: Well, `` renders an HTML ` – Jon Adams Sep 28 '11 at 18:54
  • @Mufasa: Solution to what? Wrapping the textbox in an empty table should have _no effect whatsoever_! – Eric Sep 28 '11 at 20:30
    • 0

    There may be a sneaky CSS way to achieve this that I don't know about, but in my experience this is one of the things where using a bit of Javascript is justified.

    You could get the height you need (of the current window I presume) using JQuery or Prototype, or in pure Javascript: Get the height of the current document and then

    document.getElementById("text_area").style.height = calculated_height+"px";

    The left hand padding I find odd, though. Can you post an example?

    Pekka
    • 442,112
    • 142
    • 972
    • 1,088
    0

    In order to solve this kind of problems, one has to think about how percentage is handled in the browser. First of all.... percentages don't exist, they are converted to pixels at some point. The steps are 1) browser renders all tags, 2) browser measures outer, parent, percent-sized boxes to get its size in pixels, and sets the size of the child boxes according to their percentage size. I think the first thing to verify is the size of textarea's parent box, and it's parent box, and so on. This can be done by checking the "Layout" information in Firebug and IE Developer Toolbar, and find out what's measured differently in both browsers. Once you find that element (or elemets) css can be adjusted to consider them.

    Have in mind that percentage sizing considers the width and height of parent box content to size the child element and not padding. So, if a parent box width is 500px and has 100px padding, a child element with 100% width will be 500px and the 100px padding will be around it, and both elements will take 700px of your screen.

    Andrea
    • 1,838
    • 1
    • 13
    • 7
    0

    Try

    adding a min-height:100% on the text area css. On the div containing the absolute positioned , set the position to relative on your css.

    also use transistional Doctypes instead of strict, while your at it. Make sure there are no unclosed tags. I would be better if you can make the page XHTML or HTML standard compliant so that you will have less problems with cross browser compatibility.

    McDowell
    • 107,573
    • 31
    • 204
    • 267
    Ronic Winmar Concepcion
    • 61
    • 1
    • 2
    • 7
    0

    Try adding display:blockand border:0 to your #text_area. The former should take care of the height-issue and the latter prevents the width:100% to spill over.

    Florian Grell
    • 995
    • 7
    • 18