Hack Forums
CSS How to align this element(s), no clue what the correct logic is here - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: CSS How to align this element(s), no clue what the correct logic is here (/showthread.php?tid=6078031)



CSS How to align this element(s), no clue what the correct logic is here - bevc - May 14, 2020

I have a dynamic element(s) that's like a table that floats on top of another table. Thing is, it seems to line up in a fairly arbitrary way, so it looks like this.......

[Image: Screen-Shot-2020-05-14-at-14-44-08.png]
[Image: Screen-Shot-2020-05-14-at-14-44-23.png]

You see the little 'down chevron'? That's what you mouse-over to make the element visible, but my elements don't line up the same for some reason, what I'd like is for the cell with the numbers to line up exactly, but I don't know how to do this (it's a separate table).

Can anyone help a brother out? My css knowledge is poor.


RE: CSS How to align this element(s), no clue what the correct logic is here - Nachfolger - May 14, 2020

No we can't help a brother out without the code. Put all of your CSS and HTML in pastebin.com (organized) or use jsfiddle.net


RE: CSS How to align this element(s), no clue what the correct logic is here - bevc - May 14, 2020

(May 14, 2020 06:28 AM)Nachfolger Wrote:  No we can't help a brother out without the code. Put all of your CSS and HTML in pastebin.com (organized) or use jsfiddle.net

Sorry my jsfiddle interpretation skills are almost as wank as my css abilities, but this is my best approximation of my live code. I'd like to have the numbers align with each other, such that the always visible td of currency (green) is aligned with the td of currency (blue) in the hidden/unhidden table.


RE: CSS How to align this element(s), no clue what the correct logic is here - I337 - May 14, 2020

Here you go!
https://jsfiddle.net/hkLv814m/

You have to add position: relative; to parent element and then add right:0 for the table, You can use "top: 0px" to push it donw.