Position a block element in the bottom-right of a fieldset

Question

I have several Razor pages in an MVC4 project that follow a general layout that can be viewed here. Each page will have a fieldset, and most will have either a Save or Next or whatever kind of button. What I'd really like and can't figure out is how to get the Save/Next/Whatever button to always position in the lower-right corner of the fieldset. I've attempted solutions from a couple of other questions, but sadly none seem to apply to this situation. Is this even possible?

Here's the stylesheet.

Answer 1

Put the fieldset in position:relative and put the button in Position:Aboslute with bottom:0 and right:0, this should work for one button, to place the others, do the same thing but change the right value to the combine width of the other buttons.

Example:

.lower-right-button{
    position:absolute;
    bottom: 0;
    right: 0;
}
<fieldset style="position: relative">
<input type="submit" value="Save" class="lower-right-button">
<input type="submit" value="New" class="lower-right-button" style="right: 110 px">
</fieldset>

EDIT: The bottom and right attributes align the bottom and right edge of the element with the bottom and right edge of its container. In that case, bottom: 0 and right: 0 will place it at 0 pixel from the bottom-right corner, you might want to put something else like bottom: 5px right:5px

EDIT AGAIN: Fixed, initial proposition didn't work, here's a JSFiddle

EDIT ONCE AGAIN: With Romias proposition, put the button in a div and position the div at bottom right instead, here's the updated JSFiddle

Answer 2

Relative first, then absolute.

It's quite simple really. The first step is to set the parent container's position property to relative as follows:

<fieldset style="position: relative;">
    ...
</fieldset>

This will set the boundaries for your next element to be positioned, only this time, using absolute positioning.

<div style="position: absolute; bottom: 0; right: 0;">
    <input type="submit" value="Save" />
</div>

Putting the two together:

<fieldset style="position: relative;">

    ...

    <div style="position: absolute; bottom: 0; right: 0;">
        <input type="submit" value="Save" />
    </div>
</fieldset>

After this, you can add some margin to this div tag (or pull away from the bottom right corner a little) to add some padding, throw in some styles, etc.