8 replies · opened Jan 11, 2021
hi semicolon
due to corona and internal problems at customer side, the BS1 project was postponed and now I pick it up again switching from canvas 5 to 6.
can you tell me why the content on
http://semicolon.web.my1.cc/index_2.html
is jumping down on load
while it does not on
http://semicolon.web.my1.cc/index.html
thx and rgds
guido
arghh got it
the top-bar was inside header-wrap
now that I placed it into header an not header-wrap it workz fine
sorry to bother, closed and solved
rgds
guido
sorry still not working right :-(
now the http://semicolon.web.my1.cc/index.html is jumping again, and the http://semicolon.web.my1.cc/index_2.html does a tiny jump.
the must be a way to add this top-bar in a mannor that it works for layouts with slider and others with page-title
or maybe I still haven't understood the whole logic
looks like I need yr 'pro' input
rgds
guido
Hello,
Thanks for your patience!
The #top-bar must be placed outside the #header DIV as in the Default Templates. Example:
[ch_pre]
...
...
[/ch_pre]
Simply use this CSS Code:
[ch_pre type="css"]@media (min-width: 992px) {
.header-wrap-clone {
height: 100px;
}
}[/ch_pre]
The .header-wrap-clone is resized dynamically to match any Custom Header Heights. So you can simply check the exact height of your Header after the Page is loaded and then set the Height using CSS. This will ensure that the .header-wrap-clone does not shift after loading.
This will definitely work fine. Hope this Helps!
Have a Great Day and Stay Safe.
Let us know if we can help you with anything else or if you find any further issues.
hi semicolon
so nnow I have put the top-bar outside the headerm and set the CSS
that works fine for http://semicolon.web.my1.cc/index_2.html
but for http://semicolon.web.my1.cc/index.html putting the header outside pushes the slider down by the height of the top-bar, thats why I had it inside the header.
as the slider is set to full-screen include-header classes (by the way the docs say with-header vs include-header http://docs.semicolonweb.com/docs/slider/helper-classes-3/ last table rows) now with header outside it is pushed down and the one-page-arrow as well as the slide-numbers on bottom right are cut-off.
ok I can set the slider now by css and move it up by the size of the top-bar
@media (min-width: 992px) {
#slider {
top: -45px;
}
}and at first hand that looks good and works, was just wondering if that is 'safe' or will I run into further problems in future that e.g. content after the slider has to be moved up too or is there any better solution to have the slider fullscreen-incl.-header+topbar
rgds
guido
Hello,
You can consider using the .include-topbar Class on the #slider DIV. But again this is dynamically controlled, so consider using this CSS:
[ch_pre type="css"]@media (min-width: 992px) {
#header + .include-header.include-topbar {
margin-top: calc( -100px - 45px - 2px );
}
}[/ch_pre]
This should definitely work fine. Hope this Helps!
And, apologies about the Documentation error, we will update this shortly.
Let us know if we can help you with anything else or if you find any further issues.
awesome !!! all fine that works perfect
thy, closed, rgds
guido
Great! :)
Do let us know if we can help you anything else.
PS. The data-scrollto File will be available to you within a couple of hours. :)
PS. The data-scrollto File will be available to you within a couple of hours. ?
no stress in the business. the busy easieness ;-)
as said, take yr time, make it right, test it well
often less work than touching it multiple times ;-)
rgds
guido
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard