Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Trouble sizing a textarea inside a div

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #43414
    ESDictor
    Participant

    I’m new here, having spent a few days looking at demos and lurking on your forums, but now I’m having an issue that I can’t seem to solve.

    I think [this](http://codepen.io/esdictor/pen/lKudE “CodePen”) illustrates the problem.

    I have a div that, when clicked, contains a textarea that the user can edit. Then, when the textarea loses focus, it is removed and the text is updated in the div.

    No matter what I do, I can’t seem to reliably position the textarea inside the div in a way that shows the same in different resolutions.

    Hopefully someone can help with this.

    Evan

    #128359
    JohnMotylJr
    Participant

    @ESDictor,

    Why not try adding

    textarea {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    }

    Better yet, why not just put a textarea over your div and set its placeholder to what you want?

    http://codepen.io/johnmotyljr/pen/eHFyl

    #128362
    ESDictor
    Participant

    @JohnMotylJr I think that works perfectly for me. Even if there are some things I need to change, I’m pretty sure you’ve covered everything I need.

    Are there any browser issues with box-sizing? I have to support IE9 for this.

    Thanks,
    Evan

    #128371
    drhees
    Member

    Border-Box is supported IE8 on up, refer to [Can I Use Box-Sizing](http://caniuse.com/css3-boxsizing “”). If you need to attack IE7 > then I would reccomend using Paul Irish’s suggestion for [IE CSS Targeting](http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ “”).

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.