Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Edit CSS

Home Forums Support Edit CSS

Viewing 15 posts - 1 through 15 (of 27 total)
  • Author
    Posts
  • #1939
    Cassie

    Hi there,

    There are a couple of changes that I’m looking to make but am not sure where to do it.

    1) Position the 2nd Widget in the Footer to the far left (only have 2 widgets there).
    2) Create a space between the white boxes (content) and the border of the page (show the grey background) without sidebars.

    Hope this made sense. Thank you.

    #2008
    Tom
    Lead Developer
    Lead Developer

    Hi Cassie,

    1. Do you want to stack the two widgets on op of each other? So they’re both aligned to the left?

    2. I’m not sure I know what you mean here? Do you have an example of what you’re trying to accomplish?

    Let me know,
    Tom

    #2627
    Cassie

    Hey Tom,

    If you take a look at the website (http://brotherssoundlightevent.com), you will see a red border. I would like that border to appear on the left and right of the white box as well.

    As for the footer widgets, I would like to balance them a little more with the social media widget moving more to the right. Would be good to bring the contact details widget more to the right as well.

    Cheers,
    Cassie

    #2690
    Tom
    Lead Developer
    Lead Developer

    Hi Cassie,

    The red does appear on the left and right of the white content box – are you using a small screen or low resolution? If so, that’s probably why you can’t see it.

    For the footer widgets, you can use 1 widget instead of two, and put everything inside that one widget. Then you can control the spacing more accurately, and even center align everything within the box.

    Let me know if this helps or not,
    Tom

    #3014
    Cassie

    Thanks, for that! Completely forgot about my browser being open 3/4 only.

    Still not sure about the footer widget, though. I tried using only 1 widget – using a table to separate them. Didn’t look too good. Could you please help me with this?

    #3027
    Tom
    Lead Developer
    Lead Developer

    Hi Cassie,

    If you’re only going to be adding those two things to the footer, I think it will be hard to make it look good as there will be lots of empty space no matter what.

    If you can find more stuff to put in the footer that would work, or maybe find somewhere else to place your facebook link and contact information?

    Let me know if you have any questions,
    Tom

    #3028
    Cassie

    Hmm..I will play around with it and see what looks best.

    Another question, is it possible to add a logo beside the site title in the header? When I insert an image it keeps inserting it below the site title.

    #3041
    Tom
    Lead Developer
    Lead Developer

    You should be able to do this using this CSS:

    .site-branding {display: inline-block;}
    .header-image {float:left;margin-right: 15px;}

    Tom

    #3670
    Cassie

    Thanks, Tom. But where do I add it? I have 2 css docs. One is style.css and the other is rtl.css. In style.css is says not to add my CSS there.

    #3717
    Tom
    Lead Developer
    Lead Developer

    I would use a plugin like this to add the custom CSS: https://wordpress.org/plugins/simple-css/

    Tom

    #3873
    Cassandra Teo

    You’ve been a great help, Tom! That helps heaps with customising the CSS. Thank you.

    #124789
    SSYH

    Dear Tom,

    I would like to put my site logo to the left of the site header (instead of at the bottom).

    Following your advice which I found on the WordPress forum, I added the following to my child stylesheet:

    .site-branding {
    display: inline-block;
    }

    .site-logo {
    float: left;
    margin-right: 20px;
    }

    However the header is now too high; ideally I would like it to be at the centre (or at the bottom) on the right of the logo. How should I go about doing this?

    Thanks!

    #124883
    Tom
    Lead Developer
    Lead Developer

    Any chance you can link me to your site? 🙂

    #125103
    SSYh

    Hi Tom,

    Here you go:
    integralpowerlift.com

    Cheers!

    #125180
    Tom
    Lead Developer
    Lead Developer

    Give this CSS a try:

    @media (min-width:768px) {
          .site-branding {
                margin-top: 30px;
          }
    }

    Adjust the 30px to your liking 🙂

    Adding CSS: https://generatepress.com/knowledgebase/adding-css/

Viewing 15 posts - 1 through 15 (of 27 total)
  • You must be logged in to reply to this topic.