Archived topic
Float Is On Top Of Pre Tag
3 replies · Started by Joezer on February 23, 2020
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
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.
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.
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/
