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

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!

Index This | What did the zero say to the eight?

June 2025 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with this month’s ...

Splunk Observability Cloud's AI Assistant in Action Series: Onboarding New Hires & ...

This is the fifth post in the Splunk Observability Cloud’s AI Assistant in Action series that digs into how to ...

Now Playing: Splunk Education Summer Learning Premieres

It’s premiere season, and Splunk Education is rolling out new releases you won’t want to miss. Whether you’re ...