Main Sidebar Reposition/ return-content icon question « Support Forum | Kriesi.at

Support Forum » Flashlight

Main Sidebar Reposition/ return-content icon question

4 posts from 3 voices

Started 4 months ago by DennisPajot
Latest reply from Devin
This topic is not resolved

Tags:

No tags yet.

DennisPajot
Member

First off great theme!
I found a code from an earlier thread that would move the sidebar/nav menu to touch the left side of the window..

( This will reposition the sidebar to the left - .sidebar, .arrowslidecontrolls_fullscreen { left:0; }).

This worked great, however the return-content (icons-rounded-home.png) icon at the bottom left disappears off of the page, so I cannot return to the sidebar... I'm wondering how I can move this icon closer to the left arrow icon or even above the play icon..

Any help is appreciated, I will leave the site with the issue so you can see what I'm referring to: http://www.dennispajotphotography.com

Posted 4 months ago #
Ismael
Moderator
Hi,

You can add this on your custom.css, please adjust the left and bottom values
```
.return_content {
left: 50px;
bottom: 60px!important;
z-index: 9999;
}
```
Note: Don't remove the "!important".

Regards,
Ismael
Posted 4 months ago #
DennisPajot
Member

Thanks Ismael, that worked great. It seemed to have no effect on mobile browsers however... Also the social media and the copyright info is getting bunched up at the bottom where the gallery icons are (on mobile browsers only), how might I remedy this? I'd like to control the padding above my logo and below the contact tab. Seems like that may stop the bunching... Also the menu seems wider on mobile any chance there's a way to keep it consistent width no matter what type of screen resolution?

Thanks again for the speedy reply!!

Posted 4 months ago #
Devin
Moderator
Hi DennisPajot,

Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
```
.sidebar.sidebar1.box.sidebar_absolute {
    position: fixed;
}
```
For mobile, you can use a media query to modify things only for those smaller screen sizes. For example, you would use the following to reduce the padding on the top of the menu/logo sidebar from 50px to 40px.
```
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
     #top .sidebar.sidebar1.box {padding-top: 40px;}
}
```
The social icons and the controls will overlap depending on the screen height. You could use remove certain elements on mobile sizes in the same media query, it just depends on what you want to get rid of. Mobile is a bit hard like that, its extremely variable what the user will be seeing based on screen orientation and total screen size.

Regards,

Devin
Posted 4 months ago #

RSS feed for this topic

Reply

You must log in to post.

Kriesi.at - Wordpress Themes and HTML Templates

Main Sidebar Reposition/ return-content icon question

Reply

Support Forum usage - Please read

Check out some of our WordPress Themes

Blog Categories

Latest Themes

Pages

About me…