I have a white box covering my content when viewing the website on a mobile phone not including tablets. It occurs once at the top under the first image slider, then again towards the bottom of the page... covering up a photo.
The website url is designandcrate.com
I have tried removing tags and adding tags so that the content will show up.
[span6]
[service_box title="Professional Staging with a Fresh Approach!!" subtitle=" With over 25 years of interior design experience in the residential and commercial world I am ready to focus on the area of staging! I recently renovated and staged a house in FL and loved the process and used new and older pieces to give a more realistic and fresh approach to the sometimes stagnant world of staging as a result!" icon="no" text="click "More" btn_text="See More" btn_link="#" btn_size="normal" target="_blank" custom_class="extra"]
[/span6]
I expected to see the content on my website, but can not see the content because of a white box covering the content.
ALSO a new discovery is that the issue could be a media query issue. Below is a photo of a string of code that could be related to what I am referring to.
image of code relating to media query
Screenshot of mobile view Mobile view mobileview
p.s. Sorry if I was not supposed to put a URL I am new to the forum...
UPDATE I have found a temporary fix to show content... but it does not get rid of the box itself that is causing a big space with nothing in it...
Here is the link to a video of how I did this. https://imgur.com/r9dCzDz
Try adding in your themes' custom CSS area the following:
.header:before {
background: none !important;
}
Problem solved -- Thank you for the help.
.header .header_block {
border-radius:2px
}
.camera_wrap {
padding-top:30px;
margin-bottom:-80px;
}
body.home .header:before {
height:auto;
}
.clearfix {
padding:10px;
}</div>