Site logo

Archived topic

Add floating element without sidebar

21 replies · Started by Shivam on March 19, 2021

Viewing posts 16–22 of 22

Hey David, I have found a solution. Here is what i have done:

1. First added a Genereatblock directly in the content at the desired place (from where I want it to start scrolling).

2. I added this css code to float it to the right and scroll as the user scroll the page.

@media (min-width: 769px) {
    .floating-content {position: sticky;
    float: right;
    top: 25%;
    margin-right: -301px;
	}}

Here is the link of page - https://www.staging2.nerdblogging.com/schema-markup/

Can you please check and confirm whether it is the right way or not?

Hey David, have you checked that because I wanted to apply it to my every post.

Hi there,

It should work for all posts assuming all your posts have the same element with the same specific selector. :)

Yes, I have same element on all the posts, I just wanted to confirm whether it is the right CSS implementation and it will work on all browsers and desktops or not? Since I am not good with Codes I wanted an expert opinion.

Yes, I have same element on all the posts, I just wanted to confirm whether it is the right CSS implementation and it will work on all browsers and desktops or not? Since I am not good with Codes I wanted an expert opinion.

It will work on some tablets and all common desktops viewport sizes. (tablets are included in min-width:769px)

And yes it should work on most modern browsers as well but not on old internet explorer browsers as this browser doesn't support position: sticky;. But for all modern browsers, this should work as there's no vendor specific properties on your code.

Thankyou elvin!

No problem.

This archived topic is closed to new replies.