Dashboards & Visualizations

Text box and Drop down alignment issues

muzicman0
Loves-to-Learn

I have created a basic dashboard (I am just learning how all this works) and I am mostly happy with it.  The one issue I have is that the Drop downs and Text boxs don't line up horizonatally.  How can I fix this?

muzicman0_0-1765141392430.png

To me it looks like there is extra space under the label on the text box, but I can seem to get rid of it.  

Any help is appreciated!

(Oh, this was created in Dashboard Studio)

Labels (2)
0 Karma

muzicman0
Loves-to-Learn

Not what I wanted to do, but due to other reasons, I move the objects into the canvas (instead of the default Above Canvas) and was able to get them lined up there.

0 Karma

muzicman0
Loves-to-Learn

Thanks, I really appreciated the help!  Here is the json.  

{
    "title": "LTTB Controller Logs",
    "description": "LTTB Controller Logs",
    "inputs": {
        "input_AEzz7fq6": {
            "options": {
                "defaultValue": "*",
                "token": "find_text"
            },
            "title": "Find Text (*=no filter)",
            "type": "input.text"
        },
        "input_F1B4OnMH": {
            "options": {
                "defaultValue": "__..None..__",
                "token": "exclude_text"
            },
            "title": "Exclude Text",
            "type": "input.text"
        },
        "input_OQfKfiTc": {
            "options": {
                "defaultValue": "*",
                "items": [
                    {
                        "label": "All",
                        "value": "*"
                    },
                    {
                        "label": "Notice",
                        "value": "hiperwall.notice"
                    },
                    {
                        "label": "Info",
                        "value": "hiperwall.info"
                    },
                    {
                        "label": "Warning",
                        "value": "hiperwall.warning"
                    },
                    {
                        "label": "Error",
                        "value": "hiperwall.error"
                    }
                ],
                "token": "filter_level"
            },
            "title": "Filter Level",
            "type": "input.dropdown"
        },
        "input_QQcpa6ab": {
            "eventHandlers": [
                {
                    "options": {},
                    "type": "drilldown.resetTokens"
                }
            ],
            "options": {
                "label": "Reset Filters"
            },
            "type": "input.button"
        },
        "input_global_trp": {
            "options": {
                "defaultValue": "-30d@d,now",
                "token": "global_time"
            },
            "title": "Global Time Range",
            "type": "input.timerange"
        }
    },
    "defaults": {
        "dataSources": {
            "ds.search": {
                "options": {
                    "queryParameters": {
                        "earliest": "$global_time.earliest$",
                        "latest": "$global_time.latest$"
                    }
                }
            }
        },
        "visualizations": {
            "global": {
                "showProgressBar": true
            }
        }
    },
    "visualizations": {
        "viz_1icp37A2": {
            "options": {
                "fontColor": "#ffffff",
                "fontSize": "extraLarge",
                "markdown": "The below counts include all above filters EXCEPT the 'Filter Level' filter.\n"
            },
            "type": "splunk.markdown"
        },
        "viz_H1C1aibF": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_wZKOCDBG"
            },
            "options": {
                "backgroundColor": "#595959",
                "columnFormat": {
                    "_raw": {
                        "width": 1560
                    },
                    "_time": {
                        "width": 250
                    },
                    "source": {
                        "width": 112
                    }
                },
                "count": 20,
                "headerVisibility": "fixed",
                "tableFormat": {
                    "headerBackgroundColor": "> backgroundColor | setColorChannel(tableHeaderBackgroundColorConfig)",
                    "headerColor": "> headerBackgroundColor | maxContrast(tableRowColorMaxContrast)",
                    "rowBackgroundColors": "> table | seriesByIndex(0) | pick(tableAltRowBackgroundColorsByBackgroundColor)",
                    "rowColors": "> rowBackgroundColors | maxContrast(tableRowColorMaxContrast)"
                }
            },
            "type": "splunk.table"
        },
        "viz_JkQTIHBk": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_XvajZldd"
            },
            "options": {
                "backgroundColor": "#4a4a4a",
                "majorColor": "#ffffff"
            },
            "title": "Error Records Returned",
            "type": "splunk.singlevalue"
        },
        "viz_VOErIPDJ": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_UTACVBMm"
            },
            "options": {
                "backgroundColor": "#4a4a4a",
                "majorColor": "#ffffff",
                "trendColor": "#ffffff"
            },
            "title": "Info Records Returned",
            "type": "splunk.singlevalue"
        },
        "viz_niRZXGAV": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_buun0Jdp"
            },
            "options": {
                "backgroundColor": "#4a4a4a",
                "majorColor": "#ffffff",
                "trendColor": "#ffffff"
            },
            "title": "Warning Records Returned",
            "type": "splunk.singlevalue"
        },
        "viz_rsSvhEXa": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_TQfgd756"
            },
            "options": {
                "backgroundColor": "#4a4a4a",
                "majorColor": "#ffffff"
            },
            "title": "Total Records Returned",
            "type": "splunk.singlevalue"
        },
        "viz_svlEenhe": {
            "containerOptions": {
                "description": {
                    "color": "#ffffff"
                },
                "title": {
                    "color": "#ffffff"
                }
            },
            "dataSources": {
                "primary": "ds_9KfVq5Ai"
            },
            "options": {
                "backgroundColor": "#4a4a4a",
                "majorColor": "#ffffff",
                "trendColor": "#ffffff"
            },
            "title": "Notice Records Returned",
            "type": "splunk.singlevalue"
        }
    },
    "dataSources": {
        "ds_9KfVq5Ai": {
            "name": "num_errors copy 4",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*hiperwall.notice*\" \"*$find_text$*\" | search NOT _raw=\"$exclude_text$\"\r\n| stats count"
            },
            "type": "ds.search"
        },
        "ds_TQfgd756": {
            "name": "num_errors",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*$filter_level$*\" \"*$find_text$*\" | search NOT _raw=\"$exclude_text$\"\r\n| stats count"
            },
            "type": "ds.search"
        },
        "ds_UTACVBMm": {
            "name": "num_errors copy 2",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*hiperwall.info*\" \"*$find_text$*\" | search NOT _raw=\"$exclude_text$\"\r\n| stats count"
            },
            "type": "ds.search"
        },
        "ds_XvajZldd": {
            "name": "num_errors copy 1",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*hiperwall.error*\" \"*$find_text$*\" | search NOT _raw=\"$exclude_text$\"\r\n| stats count"
            },
            "type": "ds.search"
        },
        "ds_buun0Jdp": {
            "name": "num_errors copy 3",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*hiperwall.warning*\" \"*$find_text$*\" | search NOT _raw=\"$exclude_text$\"\r\n| stats count"
            },
            "type": "ds.search"
        },
        "ds_wZKOCDBG": {
            "name": "Syslogs_LTTB",
            "options": {
                "query": "sourcetype=\"syslog\" source=\"lttb\" _raw=\"*$filter_level$*\" \"*$find_text$*\" | search NOT _raw=\"*$exclude_text$*\"\r\n| table _time, source, _raw\r\n| sort -_time\r\n",
                "queryParameters": {
                    "earliest": "$global_time.earliest$",
                    "latest": "$global_time.latest$"
                }
            },
            "type": "ds.search"
        }
    },
    "layout": {
        "globalInputs": [
            "input_global_trp",
            "input_OQfKfiTc",
            "input_AEzz7fq6",
            "input_F1B4OnMH"
        ],
        "layoutDefinitions": {
            "layout_1": {
                "options": {
                    "backgroundColor": "#595959",
                    "display": "actual-size",
                    "height": 1200,
                    "width": 2000
                },
                "structure": [
                    {
                        "item": "viz_H1C1aibF",
                        "position": {
                            "h": 870,
                            "w": 1990,
                            "x": 0,
                            "y": 190
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_rsSvhEXa",
                        "position": {
                            "h": 120,
                            "w": 200,
                            "x": 10,
                            "y": 60
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_JkQTIHBk",
                        "position": {
                            "h": 120,
                            "w": 190,
                            "x": 610,
                            "y": 60
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_VOErIPDJ",
                        "position": {
                            "h": 120,
                            "w": 190,
                            "x": 1010,
                            "y": 60
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_niRZXGAV",
                        "position": {
                            "h": 120,
                            "w": 190,
                            "x": 810,
                            "y": 60
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_svlEenhe",
                        "position": {
                            "h": 120,
                            "w": 190,
                            "x": 1210,
                            "y": 60
                        },
                        "type": "block"
                    },
                    {
                        "item": "viz_1icp37A2",
                        "position": {
                            "h": 30,
                            "w": 590,
                            "x": 710,
                            "y": 10
                        },
                        "type": "block"
                    },
                    {
                        "item": "input_QQcpa6ab",
                        "position": {
                            "h": 70,
                            "w": 130,
                            "x": 0,
                            "y": -20
                        },
                        "type": "input"
                    }
                ],
                "type": "absolute"
            }
        },
        "options": {},
        "tabs": {
            "items": [
                {
                    "label": "Syslog Data",
                    "layoutId": "layout_1"
                }
            ]
        }
    },
    "applicationProperties": {
        "hideViewModeActionMenu": false
    }
}
0 Karma

livehybrid
SplunkTrust
SplunkTrust

Hi @muzicman0 

If you can share the JSON code for the dashboard I can look at why this isnt aligning for you.

livehybrid_0-1765145042135.png

 

🌟 Did this answer help you? If so, please consider:

  • Adding karma to show it was useful
  • Marking it as the solution if it resolved your issue
  • Commenting if you need any clarification

Your feedback encourages the volunteers in this community to continue contributing

0 Karma

muzicman0
Loves-to-Learn

If there is no way in Dashboard Studio, it will just stay as is.  I know absolutely ZERO about CSS.  

0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

You could try using Classic SimpleXML dashboards as you have options using CSS to modify how things are displayed.

0 Karma
Get Updates on the Splunk Community!

[Puzzles] Solve, Learn, Repeat: Dynamic formatting from XML events

This challenge was first posted on Slack #puzzles channelFor a previous puzzle, I needed a set of fixed-length ...

Enter the Agentic Era with Splunk AI Assistant for SPL 1.4

  🚀 Your data just got a serious AI upgrade — are you ready? Say hello to the Agentic Era with the ...

Stronger Security with Federated Search for S3, GCP SQL & Australian Threat ...

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