image floating and over crossing the boundary
Hello, I'm just asking, if how is it possible to do this with websites, the details that I sent in the image, btw, this is just a self project and credits to the owner of the design. How can I achieve this, using position absolute? or is there something I will do in the code to achieve this kind of details similar to the image I sent.
like he is crossing the boundaries of the parent, like if I have a first and second section, how can I get him in the middle idk if my saying is correct sorry for my bad english. Thank you!...
Issues With Sass -container Querie - Mixin
Good morning, if anyone can help me, I want to work with container queries and mixin but they don't recognize me (@container tablet......). What can I do
What I'm doing wrong?
Thank you in advance...
Sticky header dynamic color per section
Hello guys,
I have one interesting problem which I am not yet sure how to solve. On a website I am working on, I have two primary colors (dark green and light blue).
I want the color of the text in my sticky header to switch between these two primary colors based on the background (If I can set which color to use on which section it would be awesome).
I was playing with the
mix-blend-mode property but it doesn't really suit my needs since I cannot say which two colors to use.
There is also one criteria that when the sticky header is on the border of two sections (one light, one dark) the header text have two colors (the upper part of text according to the upper section and the bottom part of the text according to the color of the bottom section)....
position:sticky; doesn't work
Well... it does. If i define the height for the parent element (.container), the sticky element works flawless. But the height is supposed to be defined based off the height of the child element in the middle. There's 3 of them and 2 are supposed to be sticky. Check my comment for
.container
https://codepen.io/Hej-123/pen/bGZVMjx
...
is it safe to use 50% there?
hey, im working on tiny recreation of a figma design and i came across this. i know that the best thing i could do is using subgrid, but sadly to this date, subgrid isn't fully supported yet. im thinking of splitting this using flex basis 50%, basically header has colspan of 2 and inside the header, there would be 2 navs, one on the right and one on the left, is it ok to do it like so?
the layout itself is easy but im not entirely sure if this is the right thing to do..
and yes, that image has rowspan of 2....
Intrinsic clamp formulation problems
Because I've managed to make my logo/title bar intrinsically responsive in a non-standard way, the very simple problem of getting that logo to float left (or the main content to float right) is proving tricky. If I
fixed instead of sticky the logo, I get a weird margin/padding protrusion. Actually using float messes up my logo/title . So I am trying to force the issue by setting the margin-top of my main to 0, but only on large screens, on small ones it should be left alone. My clamp math shenanigans which are working elsewhere is not working in this one instance.
This seems to be always zero:
```main {
margin-top: clamp(calc(9.5em + 1lh) *-1), (40em - 100vw) * 1000, 0);...