[Context: Visible on all-(except Mobile)-views with Horizontal Nav]
•Question: How would one realign Horizontal Nav buttons with CSS?
Example:
•Note: I'm not sure whether the misalignment is caused by the [All Discussions] button –or– the custom [Create//Promo] (née 'Start a Discussion') button.
•Note #2: In case it helps, here are the 2 CSS customization codes used for the [Create//Promo] button:
/*(((xv(((START-DISCUSSION-BUTTON))))))*/
//CUSTOM BACKGROUND CODE
.IndexPage-newDiscussion,
.StartDiscussionButton {
background: linear-gradient(124deg, #6600cc, #cc6600, #00cc33, #6600cc, #cc6600, #00cc33, #6600cc, #cc6600, #00cc33);
color: white;
font-variant: small-caps;
font-family: Garamond, serif;
font-size: 19px;
font-weight: 600;
text-shadow: 0 0 6px black;
background-size: 1800% 1800%;
animation: rainbow 20s ease infinite;
border-radius: 6px;
padding: 10px 20px;
margin: 10px;
display: inline-block;
transition: transform 0.3s ease-in-out, background 0.3s ease-in-out;
}
.StartDiscussionButton:hover {
transform: scale(1.5);
background: linear-gradient(124deg, #6600cc, #cc6600, #00cc33, #6600cc, #cc6600, #00cc33, #6600cc, #cc6600, #00cc33);
color: gold;
}
@keyframes rainbow {
0% {background-position: 0% 62%;}
50% {background-position: 80% 19%;}
100% {background-position: 0% 62%;}
}
//CUSTOM LABEL CODE
.IndexPage-newDiscussion::after {
content: "CREATE//PROMO";
color: gold;
text-shadow: 0 0 6 black;
display: block;
line-height: initial;
text-indent: 0;
bottom: 23px;
top: 1px;
position: relative;
}
.IndexPage-newDiscussion {
text-indent: -9999px;
line-height: 0;
}
button.Button.Button--primary.IndexPage-newDiscussion.hasIcon {
height: 40px;
}
@media @phone {
.IndexPage-newDiscussion::after {
content: "CREATE//PROMO";
color: gold;
text-shadow: 0 0 6 black;
display: block;
line-height: initial;
text-indent: 0;
bottom: 23px;
top: 1px;
position: relative;
}
.IndexPage-newDiscussion {
text-indent: -9999px;
line-height: 0;
}
button.Button.Button--primary.IndexPage-newDiscussion.hasIcon {
height: 40px;
display: none;
}
}
/*(((xv(((START-DISCUSSION-BUTTON))))))*/
