Roadfighter theme mobile rendering issue

www.webtrendsevents.com
I am experiencing problems on the mobile version where the logo is below the main image and the menu on an ipad floating both in the vertical and horizontal. Can you give me an email address and I can send you pictures?

 

Hello,

1. For the logo,
paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

@media only screen and (max-width: 767px) and (min-width: 480px){
.header_wrapper .logo img {
background: lightblue;
}
}
@media only screen and (max-width: 480px){
.header_wrapper .logo img {
background: lightblue;
}
}

In place of "lightblue" you can put your color or color code.

2. For the menu issue,
paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

@media only screen and (min-width: 1141px) and (max-width: 1400px) {.flex-caption {
width: 708px;
}}
 
@media only screen and (min-width: 960px) and (max-width: 1140px) {.flex-caption {
width: 708px;
}}
@media only screen and (min-width: 767px) and (max-width: 960px) {.flex-caption {
width: 708px;
}}

You can increase the value of "width" as per your requirement.
This will solve your issue.

 

Guys,
I tried this and it made it look worse. can you check that you have covered off everything?

Thanks

 

I have done as asked and changed a few of the px sizes but the 'call me button' still appears on the Mobile version (iPhone) and the logo on the blue background doesnt work. can i use a different colour logo for the mobile version?

 

Hello,

It is not possible to use different different colour logo image for the mobile view.

I think you want to remove the "Tap to Call" button from the mobile view.
If so, then paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

@media only screen and (max-width: 480px){
.call-us a.btn {
display: none;
}
}

This will solve your issue.

 

Thanks, I can perhaps live with the iPhone problems but when the site is viewed on an iPad it still looks different (and poor) do you have any recommendations as to the following:
Why is the ipad version not showing all of the text in Calibri?
How can i ensure that the slider text box is oprimised for the iPad?

 

In my main site (www.webtrendsevents.com) the call me button is replaced by a Register now button. is it possible to do that on the iphone? as it is still showing the call me button.

 

Could you please explain and specify your issue with the help of screenshot images.

 

The issue is that the text on the ipad is Times roman rather than Calibri on the desktop mainly- I have resolved all the other issues I believe.

 

NOW URGENT - I think that I definitely need your help - My ultimate aim is to have the call us button transformed into the Register Now button that is shown on the main web home page to be available towards the top of the up to 480px and the next size up.

It works on the desktop version and the ipad but not on the smaller screens. This is in addition to the text being Calibri.

 

Could you please specify this issue with the help of screenshot images.

 

Paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

@media only screen and (max-width: 767px) and (min-width: 480px){
.call-us a.btn{
display: none;
}
.header_wrapper .call-us {
background: red;
margin-left: 58px;
}
.header_wrapper .call-us p
{
display:run-in;
}
}
 
@media only screen and (max-width: 480px){
.header_wrapper .call-us {
background: red;
margin-right: 25px;
}
.header_wrapper .call-us p
{
display:run-in;
}
}

This will solve your issue.

 

please take a look at the attached file from my ipad and see that all of the text is Times Roman and should be Calibir- (It is Calibri on the desktop)

 

We have checked your website and there is no problem with the font type on the iPad. Please check your website again after clearing cache and also check your site at any other browser or any other media device.

 

Sorry, but i have cleared cache on both my ipad on Chrome and Safari and on my iphone and they are still not showing calibri - I have even used an entirely fresh ipad to check and it is still Times Roman!!

 

Hello,

Please follow the link given below.

http://stackoverflow.com/questions/8395285/default-fonts-available-in-safari

I hope this will help you.