This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

An image and a text widget in Header position changing position

Resolved 17 replies themetheme-vantage
11 years ago · Last reply by A Z M Arifuzzaman 11 years ago

Hello,

At first I want to thank SiteOrigin for a nice free theme. I am loving it and would like to upgrade to premium after a while.

I am an amateur in WP and building a site. I have inserted a icon and a text line in Header section. What I don’t understand is- the icon and the text are sometimes getting up, sometimes getting down. Thru couple of refresh it can be seen. I am not sure if I am missing something.

Here is the address: http://hutbazaar.com.au/hbwp/

Thanks in advance.

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

17
  1. Andrew Misplon Staff 11 years, 6 months ago

    Hi AZM

    Thanks for running Vantage.

    Try inserting the following into a Custom CSS module like the one included with Jetpack:

    header#masthead hgroup {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
    }

    Adjust 45px as required.

  2. A Z M Arifuzzaman 11 years, 6 months ago

    Hello,

    Thanks a ton for the answer!

    I am a bit confused. My understanding is to insert your code into a custom CSS plugin. I have one named Simple Custom CSS, which I am using for my own CSS. Do you mean this? I did insert, but it’s still the same.

    As the site is kept private you can check with user: test and pass: test123

    Thanks for your time

  3. Andrew Misplon Staff 11 years, 6 months ago

    That’s right, you can insert the CSS into any Custom CSS plugin/module.

    I’ll check shortly.

  4. Andrew Misplon Staff 11 years, 6 months ago

    Try this:

    header#masthead hgroup #header-sidebar {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
    }
  5. A Z M Arifuzzaman 11 years, 6 months ago

    Unfortunately, it’s not working either.

    No problem; when you will have time, can have a look in the site

    Thanks again

  6. Andrew Misplon Staff 11 years, 6 months ago

    Is your Custom CSS in place? Please leave it saved so I can see it in effect.

    Please remember not to edit style.css as any changes there won’t survive upgrade.

  7. A Z M Arifuzzaman 11 years, 6 months ago

    Yes, it is in place in the custom css plugin and saved with your last code inserted.

    No, I am not editing the style.css folder

  8. Andrew Misplon Staff 11 years, 6 months ago

    I can’t find your Custom CSS in the page source. How is Simple Custom CSS adding it’s code? Into the Head? Can you see the snippet you’re saving in the page source?

  9. A Z M Arifuzzaman 11 years, 6 months ago

    It’s in place now, I can see in inspect element.
    I put a dot before. no update, still same.

  10. Andrew Misplon Staff 11 years, 6 months ago

    Super, I see it. Please remove the second t from the first !important. So it says !importantt now, just make that;

    !important;

  11. A Z M Arifuzzaman 11 years, 6 months ago

    Yes, removed the t. I added that to check the code becomes in place or not. :)

  12. Andrew Misplon Staff 11 years, 6 months ago

    Cool, that selector is now taking precedence. Which OS and browser are you seeing the shift happen in now?

  13. A Z M Arifuzzaman 11 years, 6 months ago

    OK.. I just checked in couple of ways.

    1. Up/Down Shift happens in Chrome in Win 7. Checked in two diff machines; One is Win 7 laptop, Other is Win 7 desktop.
    2. Does not happen in Firefox. Checked in that 2 machines and page looks exactly same in both
    3. Does not happen in IE in my laptop and looks same like firefox.
    4. Does not happen in IE in my desktop, but looks bit different from firefox/IE in my laptop. That haeder section( image & the text) there is permanently placed closely to the edge of the top, looks loke all padding in bottom.

    Sorry if I am making it messy.

    I think it’s almost 90% done and I am happy! :D

  14. Andrew Misplon Staff 11 years, 6 months ago

    Is it possible that the line breaks are the issue? Try removing the breaks
    and rather use padding-bottom in the selector I sent. Does that help?

    No problem. I’m sure we can fix this.

  15. A Z M Arifuzzaman 11 years, 6 months ago

    OWAO! IT’s fixed!!! The line break was the issue. I added those as it was going down.

    Great! Man!! How did you do that!!!! I have to learn CSS! :D

    Thanks.. Thanks a lot.

  16. Andrew Misplon Staff 11 years, 6 months ago

    Awesome, glad that helped!

    For sure, a little CSS is perhaps the most useful skill you could pick up for light customisation of themes.

    Here are a couple of useful links:

    https://siteorigin.com/basics/modifying-theme-design-with-custom-css/
    http://www.codecademy.com/tracks/web
    http://css-tricks.com/
    http://learn.shayhowe.com/advanced-html-css/complex-selectors/

    All the best.

  17. A Z M Arifuzzaman 11 years, 6 months ago

    Thanks for the links. Looks very helpful.. Will have a look.

    :)

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread