Because you used position: absolute, the div is positioned relative to the first ancestor that has a fixed position. Try this instead:
function shortcode_func(){
return "<div style='position:relative'><div style='border: 1px solid red; position : absolute; top: 10px; left: 10px; width: 30px; height: 30px;'></div><img src='http://localhost/jlin.jpg' id='wow'></div>";
}
By adding a position:relative on the outer div, the inner position:absolute div gets positioned relative to the outer one, rather than whichever one further up the tree has a position specified. As the documentation (quoted below) says, the inner div is positioned "relative to its closest positioned ancestor".
These are the possible positions, copy/pasted from MDN:
static
Normal behavior. The top, right, bottom, and left properties do not apply.
relative
Lay out all elements as though the element were not positioned, and then adjust the element's position, without changing layout (and thus leaving a gap for the element where it would have been had it not been positioned). The effect of position:relative on table-*-group, table-row, table-column, table-cell, and table-caption elements is undefined.
absolute
Do not leave space for the element. Instead, position it at a specified position relative to its closest positioned ancestor or to the containing block. Absolutely positioned boxes can have margins, they do not collapse with any other margins.
sticky Experimental
The box's position is calculated according to the normal flow (this is called the position in normal flow). Then the box is offset relative to its flow root and containing block and in all cases, including table elements, does not affect the position of any following boxes. When a box B is stickily positioned, the position of the following box is calculated as though B were not offset. The effect of ‘position: sticky’ on table elements is the same as for ‘position: relative’.
fixed
Do not leave space for the element. Instead, position it at a specified position relative to the screen's viewport and doesn't move when scrolled. When printing, position it at that fixed position on every page.
