css - position overlaying div within another div -
i've got 'person' divs in 'main' div. on 'person':hover show overlaying div. want appear within 'main' div, not go beyond 'main's boundaries. way: when cursor on agch div when cursor on jalo div i want jack london's right border aligned main's right border. the complete example here: https://jsfiddle.net/yjdrnk9o/1/ html <div id="main"> <div class="person"> <span class="short-name">wish</span> <div class="more"> <span>william</span> <span>shakespeare</span> </div> </div> <div class="person"> <span class="short-name">agch</span> <div class="more"> <span>agatha</span> <span>christie</span> </div>