Forum Support

Shape 5
August 03, 2021, 11:30:20 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: How to get rid of bottom black bar in responsive mode.  (Read 601 times)
spinfx
Jr. Member
**
Offline Offline

Posts: 54



« on: August 30, 2016, 11:21:16 PM »

Hi

Here's another issue with the responsive layout for Fresh Bistro.

I've attached a screenshot that show the bar sitting over the text - this happens roughly between 750px and 900px wide - just where my client's iPad views. I've tested this with a Mobile/Responsive Web Design Tester in Chrome and found that certain 'devices' see this bar and others don't (according to their screen widths).

I used the Chrome Inspector and found the following :

Code:
.s5_responsive_mobile_present #s5_responsive_mobile_bottom_bar_outer, .s5_responsive_mobile_present #s5_responsive_mobile_drop_down_wrap #member-registration div, .s5_responsive_mobile_present #s5_responsive_mobile_drop_down_wrap .s5_regfloatleft {
    width: 100%!important;
}

.s5_responsive_mobile_present #s5_responsive_mobile_bottom_bar_outer, .s5_responsive_mobile_present #s5_responsive_mobile_top_bar {
   [color=red] display: block!important;[/color]
}

The bar disappears id "display" in the second .s5 row of code (marked in red) is removed in the inspector. However, I cannot locate which file I need to change, or which line.

The inspector shows "s5_responsive_bars-min.css"

I hope you can help point me in the right direction and help fix the problem.

Many thanks, David
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #1 on: August 31, 2016, 12:42:23 PM »

Hello,

Can you please post a URL of the site so I can take a look at it live and check the CSS?

Thanks,
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
spinfx
Jr. Member
**
Offline Offline

Posts: 54



« Reply #2 on: September 02, 2016, 08:20:50 PM »

Sorry about that. The URL is http://www.britishbistro.com.au/index.php/about-us-3

Thanks, David
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #3 on: September 05, 2016, 12:10:40 PM »

Hello,

If you add the following to the bottom of your custom.css file this should remove the black bar:

Code:
#s5_body #s5_responsive_mobile_bottom_bar, #s5_body #s5_responsive_mobile_top_bar { display:none !important;}
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.