-
Posts
-
Hello
I’ve looked at a bunch of posts but can’t seem to get the button in the second column to line up to be centered both vertically and horizontally in a 2 column row with text in the first row. There is a link to my working page in the private area. I’ve created a custom class called .homePgBus and added that into the button code but it doesn’t seem to recognise it. I also tried various bits of css (see below). Please advise – thanks! :)#avia-button-wrap .avia-button-center .avia-builder-el-37 .avia-builder-el-no-sibling {
/* position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
vertical-align: center !important; */
margin-top: 100px;
}Oh, it’s the second grey block, not the first one – ignore that please – it’s the one that starts with
Holborn’s mission is to elevate the lifestyle…Hi,
Please edit the column on the left and choose to display equal height and middle aligned – http://i.imgur.com/KKtfINw.png
Best regards,
YigitWell, of all the times I’ve used this theme I never looked at editing the columns!!!!! That works beautifully, however, the button in the second column is not quite centered – when I inspect the button’s div ie the avia wrap it has padding at the top that is about 15 pixels, plus about 3 pixels below. The client is very visual so I need it to be dead center. I have tricked it by adding a whitespace of -12 above but when I tried to add padding of -12 in the column settings it didn’t take effect. I also created a custom class of homePageBu on the button and did this –
.homePageBu {
margin-top: -12px;
}That didn’t work either. I do have it centered with the negative whitespace but is there a ‘cleaner’ way of making this work? :)
Hi,
That is a clean way as well but if you would like to adjust padding on that certain button, please add following code to Quick CSS
#your-custom-id .avia-button.avia-size-large { padding-top: 3px; padding-bottom: 2px; }and then edit your color section element and give it a custom id (“your-custom-id” in example) – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png
Best regards,
Yigit
- The topic ‘Center a button vertically in a 2 column row with text to the left’ is closed to new replies.