Splunk Search

How to make first two columns and header of those two sticky in a table?

power12
Communicator

I am trying to make first two columns of a table output to be sticky...I can do one by using 

 

 

 <html>
        <style>
          #myTable th:first-child,td:first-child {
left:0;
z-index: 9999;
position: sticky;
}

 

 

The above code works for one column on the left..But I want two to be sticky

Labels (1)
0 Karma

ITWhisperer
SplunkTrust
SplunkTrust
          #myTable th:nth-child(2), td:nth-child(2){
            left: 60px !important;
            position: sticky;
            z-index: 9998;
          }

The left position has to take into account the width of the first column + two lots of padding. You may also find that it may depend on the screen resolution being used.

0 Karma

power12
Communicator

This worked.

 

<html>
        <style>
          #myTable th:first-child,td:first-child {
left:0;
z-index: 9999;
position: sticky;
}
            #myTable th:nth-child(2), td:nth-child(2){
            left: 110px !important;
            position: sticky;
            z-index: 9998;
          }
        </style>
      </html>
0 Karma

power12
Communicator

@ITWhisperer  I tried the code but while scrolling I see only second column moving to right while scrolling to right

0 Karma
Get Updates on the Splunk Community!

Built-in Service Level Objectives Management to Bridge the Gap Between Service & ...

Wednesday, May 29, 2024  |  11AM PST / 2PM ESTRegister now and join us to learn more about how you can ...

Get Your Exclusive Splunk Certified Cybersecurity Defense Engineer Certification at ...

We’re excited to announce a new Splunk certification exam being released at .conf24! If you’re headed to Vegas ...

Share Your Ideas & Meet the Lantern team at .Conf! Plus All of This Month’s New ...

Splunk Lantern is Splunk’s customer success center that provides advice from Splunk experts on valuable data ...