Jump to content

Archived

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

seanocaside21

RevSlider Title Not Responsive

Recommended Posts

seanocaside21

Hi There,

 

I am having an issue with the responsive positioning of my RevSlider title. Basically it is being pushed off screen to the left when viewed on a tablet or mobile device. 

 

I have had to adjust the data-x & data-y to get the text positioned the way i want so is this maybe the problem? 

 

Here is the code i have used: 

 

<div class="caption slider-content left-side sfl stl tp-caption start" data-x="-125" data-y="50">
<h2><span class="slider-text">Welcome to the Internet College of Ireland</span></h2>
<a href="#" class="slider-btn">Read More</a>
</div>
 
Any help would be appreciated! 
 
Thanks,
 
Sean

Share this post


Link to post
Share on other sites
Danny

Hi Sean,

 

If you're using your code that you have created or added, this isn't something we provide support for. Its likely that you you will need to use some custom CSS to resolve your issue.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
seanocaside21

Hi Danny,

 

Thanks for that... just another quick query

 

If i choose not to use the "Slide Extra Elements" and just go ahead an set up my slides using the DMS options is there any way to adjust the position of the text using custom css. 

 

For instance on inspection i see the code below, but adjusting it has no effect..., is there a way to apply this to an individual slide?

 

element.style {
  1. opacity1;
  2. left205.5px;
  3. top130px;
  4. visibilityvisible;
  5. font-size34px;
  6. padding0px;
  7. margin0px 0px 0px 15px;
  8. border-width0px 0px 5px;
  9. line-height57px;
  10. white-spacenowrap;
  11. -webkit-transformrotate(0deg);
}

Share this post


Link to post
Share on other sites
Danny

To override an element style, you will need to use !important, even then that may or may not work. In regards to targeting an individual slide, you could the some CSS pseudo classes, but I am not sure if that will work either, but its worth a shot.

 

You could try this:

 

http://www.w3schools.com/cssref/sel_nth-child.asp

http://nthmaster.com/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
seanocaside21

Danny as usual thanks for your help... Got it working with the following: 

 

div.caption.slider-content.left-side.sfl.stl.tp-caption.start {
left: 20px !important;
 
}

Share this post


Link to post
Share on other sites
Danny

No problem, happy to hear the issue has been resolved.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

×