Change width of content for certain page

  • Resolved burrit0s

    (@burrit0s)


    12 years, 6 months ago

    Hello, I am using theme Grey White Black and the page in question is here https://ilovelightshows.com/community/.

    On this page I am integrating a forum and I want it to be much wider than the other pages. I am using a custom page template for the forum page because I didn’t want the sidebar. How do I go about making this page wider and not the other ones?

    Thanks.

Viewing 7 replies - 1 through 7 (of 7 total)

  • You will notice that each page has a POST id.

    The best way to find this is view source and search for “</head>” just after that you will see a line that looks like this “<body class=”page page-id-366 page-template page-template-page-forum-php”>”

    In this case your page id is 336.

    You can then edit your style.css file.

    So if you use the CSS class:

    .page-id-366 {
    width: 400px; (for example)
    }

    it will modify only that page’s container width. you can put any css in there that you want only applied to that page, even change background or text color etc.

    Thread Starter burrit0s

    (@burrit0s)

    Thanks for the quick response, but entering in that code only makes the entire page wider for that page. I want the content in the middle to be wider.

    I entered in:

    .page-id-366 {
width: 1200px;
}

    and all it did was make me able to scroll horizontally more. What can I put in there so it knows to only make the content or main area wider?

    you can also use the body class specific to that page template:

    example:
    .page-template-page-forum-php .content { width: 1200px; }

    Thread Starter burrit0s

    (@burrit0s)

    Worked perfectly alchymyth! Thanks to both of you for helping ??

    well right now your css is not related to anything.

    I believe this is what you want:

    .page-id-366 #spMainContainer {
    width: 1400px;
    }

    .page-id-366 .content {
    width: 1400px;
    }

    Let me know if that works.

    Or you could do what was mentioned but note that will change ALL the pages using that page template.

    Thread Starter burrit0s

    (@burrit0s)

    Mattmagi, I tried 

    .page-id-366 .content {
width: 1400px;
}

    and it worked too! Thanks

    cool, no problem that way it will only adjust that ONE page.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Change width of content for certain page’ is closed to new replies.