POSITION:RELATIVE WRAPPING AND ELEMENT HEIGHT?

Simons Hood

Total Post:70

Points:494
Posted by  Simons Hood
 1301  View(s)
Ratings:
Rate this:
Hi Everyone!

I have a simple TextArea and a button

When the button is clicked , I need to wrap (exactly) the text area with a red div (border:solid 1px red)

p.s this wrapper div must be position:relative because I need to add future absolute positioned elements

And so I wrote this code :

$(".btn").on('click',function (){

 $(".myTextArea").wrap($('<span/>', {
                    "class": 'msgAbsWrap',
                    "style": "position:relative;display:inline" /*it's inline by default ,I know*/

                }));
});

Advance Thanks!
  1. AVADHESH PATEL

    Post:604

    Points:4228
    Re: Position:relative wrapping and element height?

    Hi Samuel!

    try this way

    CSS:

    .msgAbsWrap {
       border:solid 1px red;
       display:inline-block;
       width:100%;
       position:relative;
    }
    jQuery:

    $(".btn").on('click', function () {
      $(".myTextArea").wrap($('<span/>', {
            "class": 'msgAbsWrap'
      }));
    });

    it may be it resolve your problem 

  1. Vijay Shukla

    Post:100

    Points:700
    Re: Position:relative wrapping and element height?

    Hi Samuel!

    Change the display style of the span to display: inline-block;

    $(".myTextArea").wrap($('<span/>', {
        "class": 'msgAbsWrap',
        "style": "position:relative; display:inline-block; width: 100%;"
    }));

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!