Hi. I am trying to get this layout

# compose

[Luka]

Hi. I am trying to get this layout

[Luka]

@Composable
fun TodayRow(amount: String) {

Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier
.background(colorResource(id = R.color.bg_creamy))
.height(dimensionResource(id = R.dimen.list_item_height_normal))
) {
Divider(
color = colorResource(id = R.color.dark_mode_black_2),
modifier = Modifier
.width(14.dp)
)
Text(
text = stringResource(id = R.string.today),
fontWeight = FontWeight.Medium,
color = colorResource(id = R.color.dark_mode_black_2),
fontSize = 13.sp,
modifier = Modifier
.padding(start = 2.dp, end = 2.dp)

)
Divider(
color = colorResource(id = R.color.dark_mode_black_2),
modifier = Modifier
.padding(end = 2.dp)

)
Text(
text = amount,
fontWeight = FontWeight.Medium,
color = colorResource(id = R.color.dark_mode_black_2),
fontSize = 13.sp,
modifier = Modifier
.padding(end = 2.dp)

)
Divider(
color = colorResource(id = R.color.dark_mode_black_2),
modifier = Modifier
.width(14.dp)
)
}
}

[Luka]

What i get is this:

[Luka]

Any idea what i am missing?

[alorma]

maybe you should set the middle divider with Modifier.weight(1f)

[Luka]

I removed end padding from the second divider and added Modifier.weight(1f) to it and now it works.