▼
Streaming live at 10am (PST)

Need button centered in different width columns

Design help Layout templates
#1

I am trying to add buttons to the bottom of four columns. The columns are different width. I am having trouble getting the buttons to center on each column. Please help.

image
image1123×392 29.1 KB

Here is my site Read-Only: Webflow - diad_networks
(how to share your site Read-Only link)

#2

@sheinaw Do you have a screenshot of your navigator (where you can see the orders of your elements). Since the second column is wider than the others, I suspect the div the button is in might be floating things to the left and not centering them.

#3

Not sure what I did now but they need to be inline horizontally as well.

image
image1914×868 233 KB

#4

You could adjust the margin of your button to the left and to the right to auto, instead of a fixed size.

#5

@Marius1989 thanks that worked.
How can I get them all aligned horizontally now.

#6

image
image1894×790 109 KB

#7 
.broadband-card {
    display: flex;
    flex-direction: column;
}

.fiber-start-block {
    margin: 0 20px;
}

.fiber-button {
    position: relative;
}