TwentyEleven showcase template full width

  • So I’m using TwentyEleven’s showcase template for most pages on the site, everything looks fine except on my Home page I want a youtube video to fill the entire div that it’s in.

    I found messing with article.intro helps but it then affects every page.

    I would copy the showcase template and edit it as a new template but i can’t figure out how to change article.intro without changing it on every template.

    The site is https://beta.losingseptember.com/

    Again, i want that youtube video to fill the entire space it’s in with no top or bottom margins or padding.

    Thanks for any help

    EDIT: and yes i’m using a child theme

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

  • That’s not a valid child theme currently active on your site.

    https://codex.www.ads-software.com/Child_Themes

    To answer your question, however, you can target CSS to a specific page by including the unique class in the CSS selector – so for the home page, try this:

    body.home article.intro {
   padding: 0;
}

    Thread Starter unboogyman

    (@unboogyman)

    I’ll fix the child theme.

    Sorry if this is a dumb question. What is the css selector?

    Also how do i add that css to only that one page?

    https://www.w3schools.com/cssref/css_selectors.asp

    By using the body.home the CSS is only applied to the home page. That code comes from the body tag HTML for the home page:

    <body class="home page page-id-4 page-template page-template-showcase-php custom-background single-author two-column right-sidebar">

    Yes, do fix the child theme to avoid much bigger problems down the road :).

    Thread Starter unboogyman

    (@unboogyman)

    Ok i think i fixed the child theme.

    That fix worked on the width… any idea on how to remove the height padding?

    And thanks btw!

    Padding: 0 removes all padding. There’s no margin on the vertical either. What are you wanting to change about how it’s now displayed?

    To work with CSS, it will be well worth your time to download and learn how to use Firebug – an add-on for Firefox.

    On the child theme, no it’s still not right — you should only have changes to the CSS code in the style.css file and you must have the @import line which is what connects it and imports the parent styles. Look at the instructions again.

    Thread Starter unboogyman

    (@unboogyman)

    sorry if i’m being picky… there is just a little padding on the bottom and i’m clueless of it’s origin

    here is a picture https://i.imgur.com/dSu7x.jpg?1

    looks like it’ll be some work to do a proper child theme so i’ll work on it tomorrow

    right now i just want to satisfy my ocd =)

    Okay, that’s a margin, so try this:

    body.home article.intro {
   padding: 0;
   margin-bottom: 0;
}

    Thread Starter unboogyman

    (@unboogyman)

    didn’t work =(

    It’s showing that it did work – make sure you clear your browser cache.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘TwentyEleven showcase template full width’ is closed to new replies.