<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_ASSIGNED "
title="ASSIGNED - Web Inspector: Data grid has a double left border when the first column is hidden"
href="https://bugs.webkit.org/show_bug.cgi?id=160723#c4">Comment # 4</a>
on <a class="bz_bug_link
bz_status_ASSIGNED "
title="ASSIGNED - Web Inspector: Data grid has a double left border when the first column is hidden"
href="https://bugs.webkit.org/show_bug.cgi?id=160723">bug 160723</a>
from <span class="vcard"><a class="email" href="mailto:nvasilyev@apple.com" title="Nikita Vasilyev <nvasilyev@apple.com>"> <span class="fn">Nikita Vasilyev</span></a>
</span></b>
<pre>(In reply to <a href="show_bug.cgi?id=160723#c3">comment #3</a>)
<span class="quote">> Comment on <span class=""><a href="attachment.cgi?id=285703&action=diff" name="attach_285703" title="Patch">attachment 285703</a> <a href="attachment.cgi?id=285703&action=edit" title="Patch">[details]</a></span>
> Patch
>
> View in context:
> <a href="https://bugs.webkit.org/attachment.cgi?id=285703&action=review">https://bugs.webkit.org/attachment.cgi?id=285703&action=review</a>
>
> > Source/WebInspectorUI/UserInterface/Views/DataGrid.css:93
> > - border-right: 0.5px solid var(--border-color);
> > + background-image: linear-gradient(to right, transparent calc(100% - 0.5px), var(--border-color) 0.5px);
>
> Is there a class we can use to set the border with to 0 when the column is
> hidden?</span >
We would have to add this class to every <td> in the column.
Currently, we change the width of a <col> element. We don't modify <td>'s directly.
<table class="data">
<colgroup>
<col style="width: 0%;">
...
</colgroup>
<tbody>
<tr>
<td>...</td>
</tr>
...
</tbody>
</table>
<span class="quote">>
> We would need to be careful with using background since this could conflict
> with other potential styling in the future. I also worry about performance
> aspects of using gradients like this — that is a lot of individual gradients.</span >
Agreed.</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>