Archived topic

Copyright Footer Positioning

3 replies · Started by Greg on January 4, 2017

Viewing posts 1–4 of 4

January 4, 2017 at 11:33 pm #260812

Hello,
I'm trying to have the copyright notice on the right side of the screen and to add Privacy and Terms links on the left side (on the same line) when on desktop. I used float left and right and it works on desktop. However, when I resize the browser to simulate a smart phone screen size the elements stay on left and right and looks awful. I tried to use @media in the CSS in customizer and style sheet of the child theme but did not work.
I appreciate any help with CSS to reposition the elements mentioned above on smart phone screen to be centered on top of each other (2 different lines) for small screens and to float left and right when on large screens.
Thanks,
Greg

January 5, 2017 at 12:15 am #260824

Hi Greg,

Use the built in grid system which is mobile-first:

<div class="grid-50">
    Left side
</div>
<div class="grid-50 footer-right">
    Right side
</div>

Then some CSS:

@media (min-width: 769px) {
    .footer-right {
        text-align: right;
    }
}

January 5, 2017 at 12:47 am #260835

Hello Tom,
Awesome, works like a charm.

Thanks

January 5, 2017 at 9:26 am #260951

You're welcome :)

This archived topic is closed to new replies.

Start building better websites today.