Lorem ipsum dolor sit amet, ne sea vocent scripta abhorreant, facilisi explicari mel ne, ut quo vide ridens. Mei ex quodsi inciderint, quo ad quas deleniti definitionem, vis no wisi graecis offendit. Ius ut everti detraxit expetenda, meis civibus consectetuer ea usu. Ad qui option facilisis consequuntur, pro omnis aliquip vulputate te. Solum affert expetenda eos te, et vim sale iudico impetus, in appetere postulant ius. Alia nihil utroque ex sit.
Bottom
Assign a user class of bottom-child to the relevant hmy-wrapper DIVs. Make it relative and add sufficient bottom padding to ensure the bottom positioned element will not overlap the content above it:
.bottom-child {
position: relative;
padding-bottom: 4em;
}
Assign a class of .bottom-item to the item you wish to place at the bottom. In this case, it is assigned to a paragraph tag. Then write the positioning rule (the last 3 properties in my rule are for appearance only:
.bottom-item {
position: absolute;
bottom: 0px;
display: inline-block;
padding: 1em;
border: 1px solid;
}
Write a media query with a max-width equal to the linearizing media query in your HMY style sheet to undo above rules:
@media only screen and (min-width: 0px) and (max-width: 768px) {
.bottom-child { position: static; padding-bottom: 0;}
.bottom-item {position: static;}
}
That's it.
Bottom
Lorem ipsum dolor sit amet, ne sea vocent scripta abhorreant, facilisi explicari mel ne, ut quo vide ridens. Mei ex quodsi inciderint, quo ad quas deleniti definitionem, vis no wisi graecis offendit. Ius ut everti detraxit expetenda, meis civibus consectetuer ea usu. Ad qui option facilisis consequuntur, pro omnis aliquip vulputate te. Solum affert expetenda eos te, et vim sale iudico impetus, in appetere postulant ius. Alia nihil utroque ex sit.
Bottom