0

I have a strange issue on a Gantry 4 website where I updated the content of a page and the menu title and alias and this seems to have broken the template layout.

The content is pushed to the left but only this one page is affected.

I have tried simplifying the article content to a single space in case I had introduced some invalid code but this makes no difference.

Renaming the menu alias so that it does not contain "span" in the text seems to fix the issue.

1

This took quite a while to find but Bootstrap includes some default styling as follows:

[class*="span"] {
  float: left;
  margin-left: 30px;
  min-height: 1px;
}

This unfortunately conflicts with Gantry which adds a class based on the menu alias to the body CSS selector.

To fix the problem, I created a custom CSS file and added the following code to override the Bootstrap styling:

[class*="span"] {
  float: inherit;
  margin-left: inherit;
  min-height: inherit;
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.