Hi,
I'm a newbie so please easy on me lol.
I know HTML and CSS but clearly not enough to get me out of that jam....I've been on this for 2 days can someone please help? I've customised a theme from Theme Mountain, which I downloaded yonks ago.
Each page has a slider section at the top with a banner in it. Because each page is parallax so when inspecting the site, I'm getting real confused as to what element is causing the problem or what to change (maybe even in HTML)
For desktop, laptop and tablet, I want the banners in.
For mobile phones I don't (takes too much of the screen).
When I test the pages on my desktop everything is responsive on all devices, but when I view them on ipad or macbook, the banners look like they're trying to load with a black background and I don't understand why...
Might be worth mentioning i'm sure the pages are over complicated in HTML as the theme was so rich with various options, drop down menus etc. which I didn't need. But I didn't want to delete things that might affect the layout.
In HTML, the area where the banners are look like this
<!-- Content -->
<div class="content clearfix">
<!-- Full Width Slider Section -->
<section class="section-block featured-media page-intro tm-slider-parallax-container">
<div class="tm-slider-container full-width-slider" data-parallax data-parallax-fade-out data-animation="slide" data-scale-under="1140">
<ul class="tms-slides">
<li class="tms-slide" data-image data-force-fit>
<div class="tms-content">
</div>
<img data-src="images/slider/start.jpg" data-retina src="images/blank.png" alt=""/>
</li>
</ul>
</div>
</section>
<!-- Full Width Slider Section end -->
In CSS, I did this
@media only screen and (max-width: 768px){
.page-intro, .tm-slider-parallax-container
{visibility: hidden; display: none;}
}
Literally been on this all day today and yesterday lol, can you help?
