CODEWITHSUNDEEP
cssinternet-explorercss-position
user1456508
user1456508

Reputation: 3831

absolute inside relative overflow ie

The following code below has an input field that is inside of an absolute positioned div which is inside of a relative position div. This is supposed to be some CSS trick. There is also another dive with an overflow so that the content scrolls. In IE 9, the input bar floats almost like a fixed position element. It does not have this behavior in firefox. I have this complex jquery widget that has a similar problem and I have just broken it down here into a simpler form to try to work it out.

test 

  <div style="position:relative">

    <span style="position:absolute;top:0">
      some input <input>
    </span>
  </div>
 <br>
 some numbers

   1 <br>

   2 <br>

   3 <br>

   4 <br>

   5 <br>

   6 <br>

   7 <br>

   8 <br>

   9 <br>

   10 <br>

   11 <br>

   12 <br>

   13 <br>

   14 <br>

   15 <br>

   16 <br>

   17 <br>

   18 <br>

   19 <br>

   20 <br>

   21 <br>

   22 <br>

   23 <br>

   24 <br>

   25 <br>

   26 <br>

   27 <br>

   28 <br>

   29 <br>

   30 <br>

   31 <br>

   32 <br>

   33 <br>

   34 <br>

   35 <br>

   36 <br>

   37 <br>

   38 <br>

   39 <br>

   40 <br>

   41 <br>

   42 <br>

   43 <br>

   44 <br>

   45 <br>

   46 <br>

   47 <br>

   48 <br>

   49 <br>

   50 <br>

   51 <br>

   52 <br>

   53 <br>

   54 <br>

   55 <br>

   56 <br>

   57 <br>

   58 <br>

   59 <br>

   60 <br>

   61 <br>

   62 <br>

   63 <br>

   64 <br>

   65 <br>

   66 <br>

   67 <br>

   68 <br>

   69 <br>

   70 <br>

   71 <br>

   72 <br>

   73 <br>

   74 <br>

   75 <br>

   76 <br>

   77 <br>

   78 <br>

   79 <br>

   80 <br>

   81 <br>

   82 <br>

   83 <br>

   84 <br>

   85 <br>

   86 <br>

   87 <br>

   88 <br>

   89 <br>

   90 <br>

   91 <br>

   92 <br>

   93 <br>

   94 <br>

   95 <br>

   96 <br>

   97 <br>

   98 <br>

   99 <br>

   100 <br>

</div>   
</div>

    </div>

Upvotes: 0

Views: 182

Answers (1)

Reza Assar
Reza Assar

Reputation: 209

I don't believe you are actually using the code you provided as 3 of your closing tags don't have opening tags.

You are applying absolute positioning to an inline element.

Try adding "display:block" to your span and don't forget to add a left value as well.

Upvotes: 1

Related Questions