CODEWITHSUNDEEP
htmlcss
Hedge
Hedge

Reputation: 16748

Seperate footer on left and right side of the screen

I've got a div with my footer which is absolutely positoned. When the screen-width is lower than 800 pixels I'd like the last two links of the <div> to appear on the right-side of the screen with right: 2em.

How can I achieve this?

<div class="footer">©Example| <a id="imprint">Imprint</a> | <a href="#" >AGB</a> |<a href="#">Privacy</a> | <a href="#">Feedback</a></div>

Here's the CSS: 

.footer {
    position: absolute;
    left: 2em;
    bottom: 2em;
}

Upvotes: 0

Views: 81

Answers (1)

Matt Hammond
Matt Hammond

Reputation: 372

You just have to make a media query so the to right ones will float right when below 800px;

@media screen and (max-width:800px) {
    .right {
        float:right;
        margin-left:4px;
    }    
}

Here is an example: https://jsfiddle.net/ms90pncr/

Upvotes: 1

Related Questions