[Support request] Float Is On Top Of Pre Tag

[Joezer]

Hello,

I am trying to align the “auto scroll” box with the top of the content. A simple {float:right;} works. But when a sentence is long, it causes problem. As you can see when viewing the URL that I sent on mobile.

.autoscroll {float:right;}

pre {font-family: consolas,monospace; background: #ffffff; line-height: 23px; color: #000000; padding: 0px;}

I tried position:absolute; right:0; but it makes it difficult to align the auto scroll box as the screen gets bigger.

Hope the experts can chime in

[Leo]

Hi there,

Don’t think I’m seeing the issue with browser resizing:
https://www.screencast.com/t/POpCSAX9

I feel like the two solutions you’ve tried are the only solution though.

Unfortunately this is not something the theme can control.

[Joezer]

Hello,

I edited your screenshot, you can see it there when being viewed in mobile https://prnt.sc/r6nhog

I just need to find a way to align the box to the right without it doing that thing that you see in the screenshot. This is not possible?

Because if I use right:0; position:absolute; it doesn’t happen anymore but it becomes difficult to keep it in position with different screens.

[Leo]

I don’t think there is a perfect way to deal with this unfortunately.

Have you seen it being done somewhere?

You could write different CSS for different screen sizes using media queries?
https://docs.generatepress.com/article/responsive-display/

[Author]

Posts