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

Putting Antimatter into a fixed-width container

Started by Muut Archive 11 years ago · 4 replies · 542 views
11 years ago

Hi,
I like the Antimatter styling but changing anything around is a bit tricky for a newbie as the css is quite bespoke.

Is there an easy way of putting the content into a fixed width container?

It would be quite nice if the navbar could stay wide, but that's not vital.
Many thanks,
Luke

11 years ago

I can give you some pointers, but it will require recompiling the SCSS or using custom.css:

CSS
body #sb-site {
  position: initial;   // reset this
  max-width: 600px;    // your fixed width
  margin: 0 auto;      // center it
}

body #header {
  left: 0;             // reset the header to the left
}

Might not be perfect, just tried it in the inspector, but should get you a bit closer to what your looking for.

11 years ago

Hi Rhuk
That works very nicely :)
Many thanks
Luke

10 years ago

Hi there,

I tried the code above and added it to custom.css, but it nothing changes. I cleared the cache but the content is still in full width. Did something change in the way custom.css does handle things? Thanks a million for your help!

10 years ago

@justin Case
it depends on the order of specificity of your custom.css.
If not specific enough, then your modifications are overxwritten.
That's called 'cascading styles sheet' system.
The more specific you are, the more your specifications are taken into count.

[See also link (recompiling the SCSS)[http://learn.getgrav.org/themes/customization#custom-scssless] from @rhukster]

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1357 9 years ago
Archive · by Muut Archive, 9 years ago
2 936 9 years ago
Archive · by Muut Archive, 9 years ago
2 4066 9 years ago
Archive · by Muut Archive, 9 years ago
1 2954 9 years ago
Archive · by Muut Archive, 9 years ago
3 1120 9 years ago