Relative Content

Tag Archive for htmlcsstailwind-css

I am having a problem with a project with astro and tailwind

You can see the code in my github repo,
The problem is that i want the image to be the height of the images to be the full with of the screen and the psicosmith image to be above the background image, but when i zoom it the psicosmith image move.

Tailwind breaks html on specific width

could someone explain why this is happening?
I have made it have 100% width, but for some reason on this resolution it breaks.
Not asking for spoonfeeding or anything, just want to know why is this happening. Thanks to everyone in advance!

How to add/position shape and image inside a modal?

I’m trying to replicate what’s shown in this picture using Tailwind, and I’m not sure exactly how to position the quadrant circle in the bottom right and the image on top of it. This is a modal element. I whitened out the other content in the modal so I’m only showing the quadrant circle and the picture. You can see the code below for more detail.

How to ensure an absolute positioned dropdown overflows a scrollable table and stays aligned with its trigger using CSS?

I’m working with a scrollable table in HTML using Tailwind CSS and facing an issue with a dropdown menu within the table. I need the dropdown to overflow the table’s boundaries and stay aligned with its trigger button, even when the table is scrolled. I’ve tried using position: absolute and position: fixed for the dropdown, but neither approach worked well. The dropdown gets clipped with position: absolute by the table’s overflow, and with position: fixed, the dropdown doesn’t stay aligned with the trigger button upon scrolling.