Moving the You-have-a-note Icon With Custom CSS

❓Help
#1

I’d like to apply custom CSS to move the you-have-a-note icon to be at the end of the item, instead of taking up its own row. I want to keep everything else the same – just eliminate the line where the icon is currently displayed, and move the icon to the end of the prior row.

Any hints?

#2

.is-hidingNote {
position: relative;
}
.is-hidingNote > .Node-openNote {
position: absolute;
top: 0;
right: -20px;
}

#3

Interesting. It puts the icon way over to the right of the space where the item text COULD be. i.e. It assumes the item text is maximum length. Is it possible to make the icon float over to occur immediately after the end of the actual text of the item?

Instead of:
short-item-here (space)(space)(space)(space)(space)(icon)
make it
short-item-here (icon)

#4

No, CSS doesn’t make that possible with current html structure.