Absolute positioning ignoring padding
You have two issues here:
First Issue
Your buttons are absolute but the first parent element that has a relative positioning is the mcontainer
element. Thus, the buttons will only be absolute to this element.
Remove position:relative
from the mcontainer element, and set the body
element to have relative positioning.
Second Issue
As Turnip had pointed out, padding doesn't get taken into account for absolute positioning. Thus, offset this by setting a negative bottom
and left
styling to the button container.
See the fiddle: https://jsfiddle.net/6smpvqq8/1/
Absolute positioning does not take padding into account. A possible solution would be to add another container inside .mcontainer
, that also has position: relative
. That way, the inner container would respect the padding, and the absolute positioned element would be at the bottom of the inner container.