Assistance with Child Twenty Eleven Theme

  • I’ve been creating a child version of the Twenty Eleven theme in order to match it to the rest of our site and have been getting on really well with the exception of the page width. Whatever I change I cannot seem to get the content to be narrower and more centered on the page.

    Here’s how we would like it to look on our existing site
    rework.co.uk

    And here’s how the template currently looks
    https://rework.co.uk/wordpress/schedule/

    Can anyone point me in the right direction to achieve this please?

    Many thanks

    Jo

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

  • This is due to a lack of a width in CSS for the body element, so add this to the very bottom of your stylesheet and adjust the width (and then also the width forced of any div’s within)

    body {
width: 800px;
margin-left: auto;
margin-right: auto;
}

    The last two parts center the container.

    Thread Starter Jojo

    (@rework)

    Hi

    That worked great thank you!

    Only thing now though is although the content is the perfect width that I would like it to be it has pushed it all over to the left hand side of the screen, how do I center it again please?

    Sorry, still learning! :-/

    Many thanks

    Jo

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    it has pushed it all over to the left hand side of the screen,

    I don’t see the content on the left hand side. I’m using Chrome 21.0.
    https://awesomescreenshot.com/08ef5ufda

    Thread Starter Jojo

    (@rework)

    Hi Andrew

    That screen grab is of the main home page which hasn’t been generated in WordPress. That’s what I’m trying to match with my child theme.

    Try this….
    https://rework.co.uk/wordpress/ipc-standards/

    Many thanks

    Jo

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It looks as though there’s an inline CSS style applied to the <body> HTML element, of margin: 40px;.

    This is overriding your margin auto styles.

    Thread Starter Jojo

    (@rework)

    Ahhh okay, thanks for that Andrew. So just need to delete the line margin: 40px;?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Yes Jojo.

    The CSS

    margin: 40px;

    Represents four margins in-one:

    margin-top: 40px;
margin-right: 40px;
margin-bottom: 40px;
margin-left: 40px;

    Thread Starter Jojo

    (@rework)

    Hi Andrew

    That’s great, thank you so much.

    However, I’ve searched and searched and even used firebug and cannot work out where that line of code is ??

    I’ve been through my child css, the main parent css but nothing!

    Are you able to see which file this code is in please?

    Thank you for your continued patience!!

    Jo

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Assistance with Child Twenty Eleven Theme’ is closed to new replies.