Skip to main content
W
WerdNerd
Participant
April 12, 2017
Answered

Changing the position of the homepage buttons

  • April 12, 2017
  • 2 replies
  • 971 views

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 has been closed for replies.
Correct answer Willam van Weelden

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.

2 replies

R
richaa37376493
Known Participant
December 20, 2017

Hi Peter,

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

Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
December 20, 2017

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

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Willam van Weelden
Willam van WeeldenCorrect answer
Inspiring
April 21, 2017

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.

    W
    WerdNerdAuthor
    Participant
    May 5, 2017

    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.)

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