Skip to main content
WerdNerd
Participant
Apr 12, 2017 11:20 PM UTC
Answered

Changing the position of the homepage buttons

Hello,

I'm using the Indigo layout in RH17 (without the Index), and I'd like to align the Glossary, Filter, and Favorites buttons in the center of the homepage underneath the search bar. Is there a way to do this? The buttons are left-aligned by default, but I'd much rather position them in the middle of the page.

Thanks,

Drew

This topic is closed to new replies. Start a new post to keep the conversation going.
Willam van Weelden
Willam van WeeldenCorrect answer
Inspiring
Apr 21, 2017 9:59 AM UTC

Adobe hasn't released the SCSS files for this one, so it's a bit tricky.

Please try the linked CSS. There are quite a few changes I made, so test it before using it please.

From a CSS perspective, you can also add the following to  your CSS:

body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(1){margin-left:23.75rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(2){margin-left:17.8125rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(3){margin-left:11.875rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(4){margin-left:5.9375rem}

This CSS selects the number of elements (buttons) you have. And if it is 4 or fewer (the bar can accommodate 5 as the class is grid-5) it amends the margin of the first element to center align.

View reply

6 replies

richaa37376493
Known Participant
Dec 20, 2017 9:40 AM UTC

Hi Peter,

when i am clicking on the link it is showing message as a File is in the bin by the owner.

Translate
Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
Dec 20, 2017 1:51 PM UTC

You are referring to the link in the post marked Correct Answer?

All I can say is I have now tried it on two machines and it is working just fine.

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

Translate
Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
Willam van Weelden
Willam van WeeldenCorrect answer
Inspiring
Apr 21, 2017 9:59 AM UTC

Adobe hasn't released the SCSS files for this one, so it's a bit tricky.

Please try the linked CSS. There are quite a few changes I made, so test it before using it please.

From a CSS perspective, you can also add the following to  your CSS:

body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(1){margin-left:23.75rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(2){margin-left:17.8125rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(3){margin-left:11.875rem}body.media-desktop div.frontpage-function-buttons div.grid-buttons>div:first-child:nth-last-of-type(4){margin-left:5.9375rem}

This CSS selects the number of elements (buttons) you have. And if it is 4 or fewer (the bar can accommodate 5 as the class is grid-5) it amends the margin of the first element to center align.

Translate
    WerdNerdAuthor
    Participant
    May 5, 2017 4:05 PM UTC

    Perfect! After copying that into the linked CSS, the buttons are centered. I also tried it with just two buttons in the layout, and they still remained centered.

    Thanks Willam! This is the exact solution I was hoping for.

    (P.S. Apologies for not checking this sooner. I'll follow up on my other question today as well.)

    Translate
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices