[jp_grennier]

Hi,

I’d like to make some minor adjustments to the responsive layout, for example when I view my site on my phone I find there to be too much white space below the social media icons. Is there a way I could easily make minor adjustments such as this?

Thanks,

jpg

[Sakin]

@jp_grennier: Yes you can. Send me your site URL and then I will check in.

[jp_grennier]

http://jpgrennier.com

Another related issue – I’d like to make the banner shorter on the full-sized site (keeping the logo centered) if you wouldn’t mind helping with this as well…

Thanks!

jpg

[Sakin]

@jp_grennier: You change the padding and margin as per your need and add the following CSS in “Appearance => Theme Options => Custom CSS” box.

@media screen and (max-width: 960px) {
#header-right { padding-top: 30px; }
#header-right .widget.widget_catcheverest_social_widget, ul.social-profile li { margin-bottom: 10px; }
}

[jp_grennier]

Cool, could you possibly send me a list of the media breakpoints for the theme? There are minor adjustments I’d like to make for the various screen sizes. Thanks!

jpg

[Sakin]

@jp_grennier: You can check that from your responsive.css file.

@media screen and (min-width: 1190px) { }
@media screen and (max-width: 1060px) { }
@media screen and (max-width: 960px) { }
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { }
@media screen and (max-width: 767px) { }
@media only screen and (min-width: 480px) and (max-width: 767px) { }
@media screen and (max-width: 480px) { }
@media screen and (max-width: 320px) { }

[Author]

Posts