Ambiera ForumDiscussions, Help and Support. |
|
|
|||||
|
Is there a possibility to stick the heading of a page while the rest can be scrolled underneath? |
||||
|
Yes, you can do that to any element, like the container your heading is in. Do it like this: Put your heading into a container if it isn't yet. Then select the container, right-click it, choose "HTML Code..." -> "Additional CSS styles" and enter: position: fixed; z-index: 3000; You won't see the change in the editor, but when you click 'preview' then you can see that it works. |
||||
|
Thank you, Erik, for your quick reply. It works perfectly except one thing: Top of the text (in content placeholder) is now covered by the header. How can I (i.e. you) solve that problem? |
||||
|
select the placeholder and change the first value for margin in the properties, e.g. from 0 to 80 |
||||
|
Thanks for your help, bup You brought me one step further. I used 300,0,0,0 But there is a new problem: Links to named anchors on a page point to 300 pts lower as where they are placed. |
||||
|
well, if you enter margin 300 at the top, then you just have an upper distance of 300. everything shifts down by this 300. Freely inserted elements may have to be repositioned, especially if they are outside the container that was set to 300. If you still want to place an element further up there is the possibility to SET a margin of (example: -200). just try it once |
||||
|
Using anchors doesn't work very well. The longer a web page is, the more difficult it becomes to position the anchor correctly. It would be better if you could link the anchor directly to an element like a container, an image, a button or a heading. |
||||
|
Thanks for your help. The only way I could solve the problem is to make the anchors floating and place them by trial and error. |
||||
|
Unfortunately, making the anchors float doesn't work well either. Because depending on which device the website is displayed on, the position of the anchor changes significantly. There's always a compromise to make the anchor work reasonably well on all possible screen sizes. The problem could really only be solved reliably if the anchors could be connected directly to a page element |
||||
|
Try the following and maybe it works: Make an empty div (all margins, paddings, offsets = 0) with relative (normal) position and with the excact the same size like your steady heading and place it directly under your steady heading, > under means the z-index - number < then place your anchor and test it. (w3schools says; The z-index property specifies the stack order of an element. An element with greater stack order is always in front of an element with a lower stack order. Note: z-index only works on positioned elements (position: absolute, position: relative, position: fixed, or position: sticky) and flex items (elements that are direct children of display:flex elements). Note: If two positioned elements overlap without a z-index specified, the element positioned last in the HTML code will be shown on top. ) Have a good evening SteveD |
||||
|
|
){kind=link}