My emoji picker's full of helium
-
To repro:- Scroll to very bottom of page
- Open composer
- Type part of an emoji
- Scroll down more
-
@RaceProUK Not just emojis.
-
Does anything attach to the composer?
-
@xaade CSS is hard. I mean who really knows the difference between
position: absolute;
andposition: fixed;
? Of course, that probably wouldn't be a big deal if the completion dropdowns were children of the composer panel, but they aren't. They're direct children of the body element:And what makes it really crazy is that those auto-complete menus are not sitting there for different purposes. They are left over stubs from previously abandoned auto-complete menus, but the software is obviously keeping track of them since the ID increments each time a new one is added. You can see them get injected into the DOM when you trigger a new one.
-
@abarker said in My emoji picker's full of helium:
I mean who really knows the difference between position: absolute; and position: fixed;?
To be fair... that's pretty ambiguous terminology.
-
@xaade Yeah, but if you're going to muck about with it, you better know what each one means.
-
@abarker said in My emoji picker's full of helium:
I mean who really knows the difference between
position: absolute;
andposition: fixed;
?While both use explicit co-ordinates,
absolute
is relative to the nearest ancestor element that'sposition: relative
(or thebody
if there isn't one) and moves when you scroll, andfixed
is relative to the window, so it doesn't move when you scroll.
-
@RaceProUK I thought
absolute
was relative to the nearest non-static
ancestor (orbody
if no non-static
ancestors exist).
-
@abarker Every time I've used
absolute
, it's always been as a descendent ofrelative
-
@RaceProUK relative isn't static, therefore the two things you're talking about are actually the same - but @abarker has it technically correct and you have it correct because you made sure to make it that way.
-
@RaceProUK said in My emoji picker's full of helium:
@abarker Every time I've used
absolute
, it's always been as a descendent ofrelative
Now I wish to experiment for confirmation when I get to my office later this morning. To jsfiddle!
-
@abarker said in My emoji picker's full of helium:
To jsfiddle!
-
position: relative
The element will remain in the natural flow of the page.
It also makes the element positioned: it will act as an anchor point for the absolutely positioned yellow†block.
position: absolute
The element will not remain in the natural flow of the page. It will position itself according to the closest positioned ancestor.
Because it's positioned, it will act as an anchor point for the absolutely positioned yellow†block.
Any element that is not the default value of "static" is positioned.
†For some value of "yellow": #ff3860
-
@Zecc I already knew what the documentation says. Now I want to know what the actual implemented behavior is!!!
-
@abarker Follow the link. They have live examples.
-
@Zecc Boring. I do my own examples.
-
@abarker I checked those out, and the behaviour in Chrome matches the spec.
I'm actually slightly disappointed: I wanted at least one , even if it was only a tiny one.