[UgoWP]

Hi there,

This may be a bug on the responsiveness of the theme.

From a tiny window the title appears in a small space, enlarging as the width increases, and the width of the title is fine:
https://www.awesomescreenshot.com/image/2872843/29728ffa4f69bd28396d8a481a79602f

However , as you pass 1200px, the title space becomes *smaller* instead of larger:
http://www.awesomescreenshot.com/image/2872839/f78ce83f723536cc7f8175c15f72afbc

I tried installing custom css in the customise section but both of these don’t work (I’m new to WP – I think it’s the max-width after 1200px that messes it up but I can’t change with my code):

/* Title fix in single post, doesn’t work */
.entry-title {
max-width:100% !important;
}

/* Title fix in single post, doesn’t work */
@media screen and (min-width: 1200px).is-featured-image-right.post-header-classic .entry-header, .is-featured-image-left.post-header-classic .entry-header {
max-width: 75% !important;
}

Thanks
Ugo

[serkan]

Hi Ugo,
You can try to use this custom css code;

@media screen and (min-width: 1200px) { .is-featured-image-right.post-header-classic .entry-header, .is-featured-image-left.post-header-classic .entry-header { max-width: 100% !important; } }

Thanks

[UgoWP]

Hi Serkan

Thanks for the help.

Nope, it’s not working, still the same:
https://www.awesomescreenshot.com/image/2881552/10ab2a69afb3c9b5483c80c5088ddfd9

Btw, my previous custom css somehow got deleted! Does it happen with theme update?

Cheers

[serkan]

Hi, Would you try again with Max-width 100%? I updated the custom css code. With the theme update, custom css codes do not get lost. This seems to be a very strange situation. Even if you activate another theme, the custom css code will stay there.
Thanks

[UgoWP]

Ok 100% works! Thanks

Btw if you can answer this curiosity, this is your code vs mine (that was wrong) – why is that? The parentheses need to be before the .is-featured etc..?

@media screen and (min-width: 1200px) { .is-featured-image-right.post-header-classic .entry-header, .is-featured-image-left.post-header-classic .entry-header { max-width: 100% !important; } }

@media screen and (min-width: 1200px).is-featured-image-right.post-header-classic .entry-header, .is-featured-image-left.post-header-classic .entry-header {
max-width: 75% !important;
}

[serkan]

Hi, Your code is missing fancy parentheses. If you look after 1200px then you have forgotten to put a curly bracket.