Jump to content

Archived

This topic is now archived and is closed to further replies.

lazlo

RevSlider Text Sizing Issue

Recommended Posts

lazlo

Hi,  I'm trying to add heading & text to some Revslider slides..all is okay until I view on a mobile (iphone) - if i rotate the display to landscape it look okay, but in portrait, whereas the image scales down, the text doesn't - slides 2, 4 have text on teh site below:

 

http://www.hotwash-banbury-carpet-cleaning.co.uk/

 

is there a work around or hack to help me acheive text over slides whatever the viewport?

 

many thanks

 

 

Share this post


Link to post
Share on other sites
Danny

Hi,

 

Yeah another user has reported this and it has been added to our tracker. Basically, the length of your title needs to be changed slightly. For example, at the moment you have added the following:

 

Carpet Deep Cleaning

 

You will need alter slightly and add the following:

 

Carpet Deep<br>Cleaning

 

This will break it up and will look cleaner on mobile devices. The other alternative is for you to use custom media queries and reduce the font size when viewed on a mobile device.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
dbrowne02

Hi, finally starting to use Revslider and it's great. I actually am having this same issue as this poster. How do you use custom media queries and reduce the font size so that one can see all text on all devices?

Share this post


Link to post
Share on other sites
dbrowne02

Hi Danny,

 

Thank you for the response. I read that article a few times. Unfortunately, that might be a little bit beyond my level of understanding. I am not sure where I put the media queries, or what should go in the media queries. Do you have any tips for that? Also, do you think that revslider will be updated so that text shows appropriately on all devices, or probably not? Similarly, if you happen to know of another full width slider that already have responsive text built in, that would be great.

 

Thanks for responding earlier, appreciate it.

 

--David

Share this post


Link to post
Share on other sites
Danny

OKay, basically, you get your media query code and then you wrap that around the class you want to change/re-style. For example, the RevSlider title has a class called .slide-title so you use that inside the media query and then apply your styling to that rule. For example:

 

@media screen and (max-width: 768px){
  .section-revslider .slide-title {
    font-size: 45px;
  }
}
@media screen and (max-width:480px) {
  .section-revslider .slide-title {
    font-size: 35px;
  }
}
 
As you can see, I have prefixed the rule with the .section-revslider class, this is just to make sure that the rule is used and overrides the default styling. If you want to just target that specific RevSlider i.e. so that it only effects the RevSlider on that page you can prefix the code with your RevSliders ID, which can be found in the:
 
<section id="RevSlider ID is here">
 
 

 


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • stijnxo
      By stijnxo+
      The Filtering of categories in the Masonic Gallery refreshes back to ALL categories when the DMS Revslider loads a new image?
      Anybody any idea? See Artists Category refreshes back to ALL when the DMS Revslider with images on the top loads a news image on http://www.18hrsfestival.nl/
    • carl
      By carl+
      Trying to convert a site over to PL5 from DMS2. Can we use revslider? Can any portion of DMS2 be editable or imported through PL5?
      I'm trying to wrap my head around the new PL5 os, but things have changed so much it like learning a new software. I DO like the new UI! Great job.
    • Lisa Haran
      By Lisa Haran+
      Hi 
      I have a map here http://www.iloveoffset.com/maps/
      I want to add several pointer locations to the map, but when I do they do not appear.
      On this map there are 2 pointer locations and as you can there is only one visible.
      Earlier today I added 7 and could only see 4 so there is something odd going on.
      My theme is up to date
    • jennajonesdesign
      By jennajonesdesign+
      Hi Guys, 
      I just went live with this site. http://bikenet.org/
      I can see the video background in Firefox, Chrome and IE on my computer as well as my husband's computer and my phone. So I am not able to see any problem. 
      But, my client says she cannot see the video background in Chrome?? Any ideas? 
      Let me know. Thanks!
       
      Jenna
    • Bleuy
      By Bleuy+
      Problem: Full Screen Revslider content runs off the screen on mobile devices (particularly calls to action buttons).  I've used the <br> to break up the text, however the call to action buttons run off the screen.  Therefore without making the fix too technical (and I can see some VERY technical resolutions on here) my client just wants to simple centre justify the text when being viewed on a mobile device.  
      Any ideas on how best to achieve this in a simple, non too technical way?
      Thanks very much in advance
       
×