Make the security panel's origin view a proper table

The origin view is currently a <table> with <div>s instead it, which is
a little odd. The row <div>s are inidividually laid out with flexbox to
look like a table, but the only thing forcing the column width to match
is a 110px width.

But this means, if one of the names doesn't fit in the space (the names
are now localized), it gets cut off from the left. Were it a min-width
instead, just that row would be pushed over, which looks weird.

Since this is an actual table, and is even a <table> element already,
switch the contents to <tr> and <td> and match the layout with table
rules. (I got the spacing to match, but there's a few pixels of
shift that I wasn't able to work through. I assume that's not
significant.)

Screenshots:
https://drive.google.com/drive/folders/1uqVhwfnf478OmASC2_ssRGOxqpN85-Fz?resourcekey=0-exd_0Jg18vPKYTuGOg06LA&usp=sharing

(CT coming and going in the screenshot is unrelated to the CL and just a
consequence of official vs unofficial builds.)

Bug: 1344541
Change-Id: Ia9efe067bfc1fdd8460c77f00ccd8561f78a2705
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3758116
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: David Benjamin <davidben@chromium.org>