Archive pages are appearing wrong

Hi there,

It seems like the template displaying the archive is missing some core GP HTML elements which add the background color and padding.

It would be best to adjust the templates to have the same HTML markup as GP, or you can do this:

.term-renewed-tv-shows #main {
    background: #fff;
    padding: 40px;
}

Hi Tom

Right OK, I can see CSS on these custom templates but I am unsure what I should set?

What is the HTML markup GP normally adds that I should add to these?

Ideally I would like to add something universal across all these, not specific to each archive page if that makes sense?

Thanks.

Your template is missing the content wrapping elements seen here: https://github.com/tomusborne/generatepress/blob/2.2/content.php#L12-L13

If you add those, you should get consistent styling :)

Hey Tom

So I decided to use:

#main {
    background: #fff;
}

Across pages but for some reason when the screen size is resized to smaller say tablet or mobile size the white background vanishes and it turns grey again?

Any ideas why?

I'm not seeing that - can you try clearing your browser cache?

If that doesn't help, can you show me a screenshot of what you're seeing?

Maybe I didn't explain very well.

Here is screenshot so you can see what I mean, I have tried in multiple browsers and clearing the cache but still have the same issue.

http://beta.ukairdates.com/wp-content/uploads/2018/11/Screenshot-2018-11-27-at-19.44.41.png

Thanks for your help!

Hmm, here's what I'm seeing: https://www.screencast.com/t/Mn5VEyoUDcjj

As a guess, you could try this CSS:

.js-wpv-view-layout:after {
    content: "";
    display: table;
    clear: both;
}

Looks like this has done the trick Tom! Thanks :)

You're welcome :)

Hey Tom,

I can't figure out why this is not working on the search results archive page:

http://beta.ukairdates.com/?s=test

Any ideas why it's not working? Seems to work everywhere else.

Hmm, you could try this instead:

#main:after {
    content: "";
    display: table;
    clear: both;
}

Great that fixed it :)

Awesome :)

Hey Tom,

Hope you are well.

Realised this only solved the issue if there are results, for some reason if there are not any results the content breaks out the white container again.

Example: http://beta.ukairdates.com/?s=fjuerjg8rjf9o

Any idea why?