Hi again Roman,
Further to my update just now, I double checked once more and found that the system hadn’t actually updated my new anchor link, because I had to save the page first after changing the row ID. So my previous test was not accurate. What I’ve done now:
- I updated CSS code
- I changed the row ID from sa-greece-cyclades to pg-733-1
- I saved my page
- Then I changed the anchor link in my text from #sa-greece-cyclades to #pg-733-1
My “anchored” blue row element (showing text Mykonos) has moved up as you can see here whereas it should be on top of the area starting with “The party island”.
The same row element has become wider. The width is now slightly wider than the common row width, making it sticking out on both ends. You can also see that in the screen show.
Clicking on the actual new anhor-link does give the desired effect (well, almost, you suggested 140 offset and I think it must be 150 instead), however with the blue row element (which is actually the anchor) disappearing somewhere in the top. You can see the result here.
I hope the effect is clear. Pending issues:
- The blue row element must not move up but stay in place
- The blue row element must not become wider
- Note that I would want this offset to be applied only for desktop display, the mobile version worked perfectly as it was (since the mobile version hides the site header, hence it does not cover anything)
Although my website is live, I will leave the settings as you advised them (I have only changed the cyclades anchor so far, not the other ones yet) until I hear back from you.
Hope I was able to explain myself, please advise. Using anchors, by the way, is not uncommon, right?