Too much space under the header-area

Permalink Browser Info Environment
Hi,

i have a little problem with the template slate.
When I watching my page with a smartphone, there is a lot white field under the slideshow(over the ?breadcrumbs?).

The slideshow is in the header-top-area.

On my personal computer its looks good.

I have seen a file that called "mobile.css" .
I tried already some with the file, but had no success.

I try it with different smartphones already .
(LG Optimus Speed with Android and Samsung GT S5620)

Can you give me a tip to resolve the problem ?

The Homepage is:
http://www.ibb-agesche.de/cms/con5...


Greetings from Germany.

Type: Discussion
Status: New
ibbagesche
View Replies:
c5mix replied on at Permalink Reply
c5mix
Yeah, that's kind of a limitation with how the default slideshow works. Because it sets the image as the background of the slide div and sets a height on the div, there's no way to auto set the height of the div in the mobile version. The image is able to be scaled via css, but since it's a background image there's no way to tell how high the div should be. A fix would be if all the images are the same height in all your slideshows, you could add a height in pixels to that div in the mobile.css file like this:
.ccm-SlideshowBlock-display .slideImgWrap div {
    height: 100px; /*modify this to your needs*/
}
ibbagesche replied on at Permalink Reply
ibbagesche
Thank you for the fast response.

I have put the code in to the mobile.css, but it do not work.
The space under the slider remains.

I also put the slider on other column, but the problem exist again and again with too much white space between the slideshow and the next element. But only on the smartphone. I am helpless.

Could may the slideshow be the problem ?

It would be nice so you can help me to resolve the problem.


Greetings.
c5mix replied on at Permalink Reply
c5mix
First, clear your site's cache (go to Dashboard -> System & Settings -> Clear Cache) and your mobile browser's cache. The old mobile stylesheet is most likely cached in.
If it still doesnt work try adding !important after the height, so it should be:
height:100px!important;
ibbagesche replied on at Permalink Reply
ibbagesche
It dosent work.
I have cleared the cache on concrete5 and on my phone.
I use the slider from concrete5. With another slider like "Power Slider Lite" everything goes smoothly.

But with the free slider on the marketplace there are problems with the presentation on the smartphone. The size of the image are not adjusted.
The pictures appear too large.

What could be the problem?


Greetings
c5mix replied on at Permalink Reply
c5mix
I dont see this in your mobile.css file.
.ccm-SlideshowBlock-display .slideImgWrap div {
    height: 100px!important; /*modify this to your needs*/
}

Did you remove it? Because it wont work without that in there
ibbagesche replied on at Permalink Reply
ibbagesche
Yes i have remove that.
Now i have upladed the changed mobile.css
ibbagesche replied on at Permalink Reply
ibbagesche
It changes nothing.
I've tried a few settings but the space remains.

Do you have any idea?
Thanks for the help.
c5mix replied on at Permalink Reply
c5mix
Change it to this:
.ccm-SlideshowBlock-display, .ccm-SlideshowBlock-display .slideImgWrap div {
    height: 100px!important; /*modify this to your needs*/
}

You have to add the height to the outter wrapper div as well.
ibbagesche replied on at Permalink Reply
ibbagesche
Perfectly, it works!

But now I have a big problem with tables on the smartphone.
I have also problems with the sequence of the display of columns on the smartphone.

Is it possible to show the complete website on the smartphone and the user can scale/zoom the page ?

I've renamed the mobile.css debugging purposes and delete in the columnal.css all entries which are intended to adjustment on smartphones (from the entry / * COLUMNAL - MOBILE). However, the content of the footer will not display properly on the smartphone. And other things.

Thank you.
c5mix replied on at Permalink Reply
c5mix
Great!
Yeah tables can be a mess. Here's some links you might want to check out:
http://www.quirksmode.org/m/table.html...
http://css-tricks.com/responsive-data-table-roundup/...
To get the complete site on mobile, you'll need to remove this line from the theme's header.php file:
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
FluxxMarketing replied on at Permalink Reply
FluxxMarketing
I've just started working on my site. I'm having the same issue with too much space showing under the header on my laptop in any browser. I'm not a programmer developer, so there's probably a simple reason that I'm just not aware of, but would appreciate any feedback you could give:http://hoppermarketing.com/
c5mix replied on at Permalink Reply
c5mix
Resize your images to be 1100 pixels wide and it should fix that problem.
FluxxMarketing replied on at Permalink Reply
FluxxMarketing
Ooops. Sorry. Thought I had. All good now. Love the theme by the way. Very easy to use.
c5mix replied on at Permalink Reply
c5mix
No problem. Thanks for the great feedback!

concrete5 Environment Information

Browser User-Agent String

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You have not specified a license for this support ticket. You must have a valid license assigned to a support ticket to request a refund.