CMS Development

Jlawal
Top Contributor

Centering page content

SOLVE

I am trying to center the content on this page while shortening the line length.


I would like to do it via the stylesheet as this is a style that we would like a number of pages to have.

 

Any help would be greatly appreciated.

 

Many thanks,

 

Jamila

0 Upvotes
1 Accepted solution
Jsum
Solution
Key Advisor

Centering page content

SOLVE

@Jlawal,

 

The content on this page is wrapped in a container with the class "page-center". This class is set in your css to be a max-width of 1100px, float none, and margin left and right auto. Basically it is already centered.

 

are you trying to shorten your line length and the content is pulling to the left of the page-center wrapper?

 

If you find "page-center" in your style sheet and change the 1100px to what ever max width you'd like it will work by shrinking the width of the outer most container ("page-center"), which is already centered but will be shorter. This change will effect any page using page-center on a container.

 

If you only want to do selective pages you can add a class such as "small" to the container with the class "page-center" and in your css you can string class names like so:

.page-center.small {
    max-width: 900px;
}

Now if a container has both "page-center" and "small" as a class then the max width is 900px.

View solution in original post

0 Upvotes
1 Reply 1
Jsum
Solution
Key Advisor

Centering page content

SOLVE

@Jlawal,

 

The content on this page is wrapped in a container with the class "page-center". This class is set in your css to be a max-width of 1100px, float none, and margin left and right auto. Basically it is already centered.

 

are you trying to shorten your line length and the content is pulling to the left of the page-center wrapper?

 

If you find "page-center" in your style sheet and change the 1100px to what ever max width you'd like it will work by shrinking the width of the outer most container ("page-center"), which is already centered but will be shorter. This change will effect any page using page-center on a container.

 

If you only want to do selective pages you can add a class such as "small" to the container with the class "page-center" and in your css you can string class names like so:

.page-center.small {
    max-width: 900px;
}

Now if a container has both "page-center" and "small" as a class then the max width is 900px.

0 Upvotes