Docs

[tonylees]

Hi there,
I am having trouble with the responsive view of my website (examples attached)

Could you take a look and advise how I can fix this please (Text not resizing, icons over text areas, no spacing between text areas etc)

Thanks
Tony

[tonylees]

Ipad portrait view

[Christopher]

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[tonylees]

sorry forgot that bit hahaha

http://www.mardybums.co.uk

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> CSS :

@media (max-width:767px){
a.x-btn.btn-on-white-bg {
    margin-bottom: 13px;
}
}
@media (max-width:480px){
a.x-btn.btn-on-white-bg span {
    font-size: 15px !important;
}
}

Please remove height: 190px; from section #6 style filed.

Hope that helps.

[tonylees]

I have done that, thanks, fixed some issues.

Please see attached for Ipad portrait issues

[Christopher]

Hi there,

Please remove font-size from <span> tags and try responsive text element. You just need to add a CSS class, e.g. h-resp, to the custom headline element under Class field of its settings (see: http://prntscr.com/7qeolc) or to span tag <span class="h-resp"> EXTENSION</span>. Then you can use this class as a selector under your responsive text element (see: http://prntscr.com/8rl3vr).

Please remove following CSS :

.x-pricing-column-info .x-btn {
    position: absolute;
    bottom: 15px;
    margin: 0;
    left: 50%;
    margin-left: -78px;
}

Hope it helps.

[tonylees]

Hi There,

the css you want me to remove was suggested as i need the ‘Read More’ buttons to be in the same position (equalizing the columns), is there a better way to achieve this?

Also I have made the changes in the responsiv text element (Didn’t know about this), still not quite right though…

[Friech]

Hi There,

Please adjust the Responsive text settings until you get the desired result, with the length of your headings you need to make it smaller when viewed on medium screen. Or you can utilise the Hide Base On Screen Width to have a specific ROW for medium screens.

Let us know how it goes.

Thanks.

[tonylees]

Hi
Sorry for the delay,

I have tried adjusting the Responsive text setting but the minimum font size is being displayed regardless of the screen / device type.

Please help 🙂

Thanks
Tony

[Christian]

Hey Tony,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[tonylees]

This reply has been marked as private.

[Christian]

Hey Tony,

You didn’t add the h-resp class to each of your headline. I’ve added to your Consult headline. Please see the effect. After that, adjust the Compression setting of the Responsive Text. Please also update Cornerstone.

Thanks.

[tonylees]

HI
Thanks for the help, but it is the text in the green banner that is causing me the most trouble…

The last words are running in to each other when viewing the site in IPAD Portrait view.

Thanks
Tony

[Rupok]

Hi Tony,

You can try adding this under Custom > CSS in the Customizer.

@media only screen and (min-width: 767px) and (max-width: 1024px) {
.home #x-section-6 .h-resp {
  font-size: 17px !important;
}
}

Hope this helps.

[Author]

Posts