Extra Space on Mobile Site

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Tagged: listing page photo

Author

Posts
January 6, 2016 at 6:13 am #66827

janine dodge
Expired Member

Post count: 153

Hi guys,

The homepage spacing looks fine on a desktop but on the mobile site there’s a huge gap between the header and content. Is there any way to fix it?

Thanks for all your help.

~Janine

January 6, 2016 at 6:14 am #66828

janine dodge
Expired Member

Post count: 153

This reply has been marked as private.

January 6, 2016 at 1:57 pm #66988
Guust
Moderator

Post count: 29970
I added this to your style.css, the bold bits are new:
```
@media only screen and (max-width: 960px)
.site-inner {
    <strong>margin-top: -40px;</strong>
    padding-left: 5%;
    padding-right: 5%;
    <strong>padding-top: 0px;</strong>
}
```
January 6, 2016 at 5:04 pm #67170

janine dodge
Expired Member

Post count: 153

Thanks, Guust! Beautiful!

January 6, 2016 at 10:31 pm #67237

Guust
Moderator

Post count: 29970

You’re welcome 🙂

February 17, 2016 at 5:42 am #123533

janine dodge
Expired Member

Post count: 153

Hi Guust,

I tried locating that code you added above in response #66988. Please see attached photo, is that the same style.css you added it to? I couldn’t find it in there. I’m asking because I’m trying to figure out how style.css works.

Secondly, for the listing page, I’d like to remove the gray box on the right (photo attached).

When I add the following to design > scripts it doesn’t seem to work:

.gd-adv-search-labels label.gd-adv-search-label {display: none;}

What am I missing?

Thanks,

Janine

February 17, 2016 at 9:30 pm #123893
Guust
Moderator

Post count: 29970
When adding to the style.css file, it should always be the child theme’s stylesheet:
WP admin > appearances > editor > child theme > style.css
in your case that is (put URL in front)
/wp-admin/theme-editor.php?file=style.css&theme=geodir_geo-1280

I added !important:
```
.gd-adv-search-labels label.gd-adv-search-label {display: none !important;}
```
If you can see in the inspector that the existing code is not overwritten, adding !important will give precedence to your new code.
February 18, 2016 at 5:20 am #123969

janine dodge
Expired Member

Post count: 153

Thanks, Guust. It worked. When would I ever use scripts over style.css?

February 18, 2016 at 5:25 am #123971

janine dodge
Expired Member

Post count: 153

Hi Guust,

My photos show up fine under the detail page but on the listing page it gets cut off. How can I make it so it automatically adjusts like the detail page? Thanks.

~Janine

February 18, 2016 at 5:03 pm #124236

Paolo
Site Admin

Post count: 31211

HI,

that’s only possible if you upload images in 4:3 format. 800px X 600px for example.

In that case they would look perfect everywhere.

Thanks

February 25, 2016 at 10:59 pm #128037

janine dodge
Expired Member

Post count: 153

Hi Paolo,

Thanks. I can make those adjustments going forward. However, I have hundreds of photos already uploaded. Is there a more efficient way to automatically format those to 4:3?

Also, shouldn’t the social importer automatically format the photos to 4:3? This is how I’ve been adding the listings. Thanks.

~Janine

February 26, 2016 at 3:33 pm #128364

Paolo
Site Admin

Post count: 31211

Hi,

no there is no automatic way to do that. Social importer imports what it founds, it can’t convert images on the fly.

Thanks
Author

Posts