Describe the issue
The Metric chart ul element can have conflicting styling inside of kibana.
|
<ul |
|
role="list" |
|
className="echMetricContainer" |
To Reproduce
Steps to reproduce the behavior:
- Go to
<kibana-url>/app/observability/cases
- Create a new case
- Click to add a Lens chart to the description.
- Create a simple metric chart.
- Save and return from Lens.
- Save and preview the chart.Expected behaviour
- Notice bad sytyles.
The ul element of the chart renders correctly in any kibana environment.
Screenshots

Version (please complete the following information):
Additional context
I think the best solution here is to add overrides overrides for the all possible offending styles to the .echMetricContainer.
.echMetricContainer {
margin-inline-start: 0 !important;
}
We should also check for other usages of ul or li, etc and possibly add more robust styles to cover all components in charts.
Describe the issue
The
Metricchartulelement can have conflicting styling inside of kibana.elastic-charts/packages/charts/src/chart_types/metric/renderer/dom/index.tsx
Lines 206 to 208 in ee7b7c1
To Reproduce
Steps to reproduce the behavior:
<kibana-url>/app/observability/casesThe
ulelement of the chart renders correctly in any kibana environment.Screenshots
Version (please complete the following information):
latestAdditional context
I think the best solution here is to add overrides overrides for the all possible offending styles to the
.echMetricContainer.We should also check for other usages of
ulorli, etc and possibly add more robust styles to cover all components in charts.