ADELLE: center align text in nav possibly change date format

  • kimberlyladams · Member ·

    Hi there,

    I’ve looked everywhere and tried everything but can’t seem to find a solution to centering the text in the navigation bar.

    Additionally, I was wondering if I could change the format of the date so it falls just below the post title instead of off to the side.

    Thank you!

    The blog I need help with is: (visible only to logged in users)

  • thesacredpath · Member ·

    Hi there, add the following to your custom CSS at the very bottom, below all other CSS to center your menu. I’ve limited this change to 601px and wider screens/windows because at 600px and below, the touch menu activates (for phones and tablets) and centering it can cause issues. 

    @media screen and (min-width: 601px) {
	.navigation-main {
		text-align: center;
	}
	.navigation-main ul {
		display: inline-block;
	}
}

    I also noticed that the “Menu” text does not show when the touch menu activates because it is the same color as your background for the menu, so also add the following which makes the “Menu” text black. 

    .menu-toggle {
	color: #000;
}

    On moving the date, the three parts of the date, day, month and year, are all separate elements, and we would have to use relative or absolute positioning to move those below the title. The problem is if the title goes to two lines (long title) or the browser window is narrow, or the site is being viewed on a small screen, the title and date would end up overlapping each other. Due to the design of the date, this just isn’t something that can be done cleanly so that it will work in all configurations.

  • kimberlyladams · Member ·

    Thanks so much! I figured the date thing may be a bit complicated. This works though!

  • thesacredpath · Member ·

    You are welcome.

  • The topic ‘ADELLE: center align text in nav possibly change date format’ is closed to new replies.