Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

Fixed width of navigation bar possible?

Started by Muut Archive 11 years ago · 2 replies · 557 views
11 years ago

Hi there!

I made a custom css file and added this code to it:

body #sb-site {
position: initial;
max-width: 1200px;
margin: 0 auto;
!important;}

body #header {
left: 0;
!important;}

to make the site appear in a fixed width. It all works well, but now the navbar and its content is vanishing to the left and right side, when I open the website on bigger screens. Is it possible to give the navbar a fixed width, too?

And another question:

How can I hide the page title (logo title) in the navbar/header completely?

Additional information:

Theme: Antimatter
Website: www.the-dystopian.com

Thanks a million and keep up your awesome work!

11 years ago

Just remove the background color and shade from #header and put them on #navbar instead.

This is just basic CSS styling stuff. I suggest you use the web inspector in chrome to try this stuff live on your site.

10 years ago

Thanks for this info. I'm using Antimatter and wanted to re-size text in my navigation bar. Using Chrome inspector it looked like #header and #navbar was where the font size was located. I did in search my Grav install and found a file called _header.scss, which contained #navbar ul.navigation. I used that to update my custom.css file to the below, and it just worked. I'm like a week in to learning CSS, if you can't tell. :)

CSS
#navbar ul.navigation {
    font-size: 1.4rem;
}

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1362 9 years ago
Archive · by Muut Archive, 9 years ago
2 939 9 years ago
Archive · by Muut Archive, 9 years ago
2 4069 9 years ago
Archive · by Muut Archive, 9 years ago
1 2959 9 years ago
Archive · by Muut Archive, 9 years ago
3 1124 9 years ago