This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

960px wide header image getting reduced to ~920px

  • Creator
    Topic
  • #15104
    bartwindrum
    Participant

    I have a 960px wide .png image (transparent background). Apparently it’s getting reduced to ~920px or so. Is this intentional? Is the theme forcing a 20px left/right margin, or were I to make the image 1000px wide would it reduce to 960px wide?

Viewing 13 replies - 1 through 13 (of 13 total)
  • Author
    Replies
  • #15107
    Jason Bobich
    Keymaster
    #15112
    bartwindrum
    Participant

    Thx. I put the code into the theme custom CSS field and of course it worked.

    Next: I installed and played w/Firebug. Seems that child gets header padding passed from parent, hence still no clue which file to edit in child (apparently it’s not the child style.css …) If it’s possible to unpad the header via child I’ll do it there if you can point me to the file. TIA.

    Lastly, I wanted a bit of bottom padding so I expanded the graphic’s canvas, saved and copied over the header graphic file via ftp. refreshed screen and flushed website cache inside WP. Changes not taking effect… do I have to empty the browser cache too, or do I need to use the theme UI to reapply header graphic? BTW this is the 2nd time I’m encountering this sort of image swap failure; yesterday the same scene occurred with a slider graphic; delete graphic, reimport via WP media mgr, delete/import via slider button, displays old graphic. Had to append “2” to filename to get it to take…

    #15114
    bartwindrum
    Participant

    Regarding graphic swapping, I may have neglected the save button after removing the header pix since it’s all the way at the bottom of a long page. So now my successful method is delte pix assignment, save. Use media mgr to permanently delete. Use media mgr to upload new. Assign new pix and save. Works fine. Lotsa steps.

    #15134
    bartwindrum
    Participant

    Hi Jason, I’m sure I posed this ? along the way but can’t find the thread/location so here it is again: I’ve entered #branding .header_content-content { padding: 0; } in Akita’s styles custom css field. Scouted the child theme writeup some but it’s opaque to me. If you can tell me where to put this in the child theme I’ll drop it in there; I understand how that’s preferable.

    While we’re at it, will Akita updates reset all the style/layout etc customization to defaults?

    #15139
    bartwindrum
    Participant

    btw I did what the video said, added #branding .header_content-content { padding: 0; } as a line in the child styles.css file. I removed that line from the parent Theme Options custom CSS field, and the header padding was restored. Leaving me clueless…

    #15155
    Jason Bobich
    Keymaster

    Next: I installed and played w/Firebug. Seems that child gets header padding passed from parent, hence still no clue which file to edit in child (apparently it’s not the child style.css …) If it’s possible to unpad the header via child I’ll do it there if you can point me to the file.

    In CSS, you can override anything with your own preceding CSS. And so this is why you’ll notice that your style.css file comes after all of your other CSS files, giving you full control to overwrite anything from this file. So, yes, your overriding CSS would go in your child theme’s style.css.

    Regarding graphic swapping, I may have neglected the save button after removing the header pix since it’s all the way at the bottom of a long page. So now my successful method is delte pix assignment, save. Use media mgr to permanently delete. Use media mgr to upload new. Assign new pix and save. Works fine. Lotsa steps.

    It’s just sort of basic CSS here, not really anything specific to our themes or anything. Let’s say there’s some item with a background image you want to customize. —

    You’d first see how the theme is adding that background image by using an inspector like Firebug. You’d then create your own version of that background image and put it in your child theme. Then, you’d write your own line of CSS to apply your new background image from your child theme’s style.css.

    While we’re at it, will Akita updates reset all the style/layout etc customization to defaults?

    Updates do not wipe any kind of customizations you’ve made through your WP Admin. As far as any kind of customizations you’ve made to the actual files of the theme, this is why you use a child theme. When you update your parent theme, your child theme remains, untouched. However, if you’ve edited any files of the parent theme — PHP files, CSS files, graphics, etc — these will all obviously be overwritten and wiped away.

    btw I did what the video said, added #branding .header_content-content { padding: 0; } as a line in the child styles.css file. I removed that line from the parent Theme Options custom CSS field, and the header padding was restored. Leaving me clueless…

    Show me a live link to this issue. I’m sure there’s just some minor mistake.

    #15172
    bartwindrum
    Participant

    re: adding #branding .header_content-content { padding: 0; } as a line in the child styles.css file and removing it from the parent Theme Options custom CSS field, and the header padding was restored

    Show me a live link to this issue. I’m sure there’s just some minor mistake.

    What do you mean by live link? Do you want me to add/delete the lines from the respective locations and give you a site URL? If something else I’ll need a more specific instruction.

    BUT, if using the parent Theme Options custom CSS field will persist through a parent theme upgrade I can leave it there.

    #15176
    bartwindrum
    Participant

    Hi Jason. Guessing at what you need to observe, I’ve redone the zero padding move from the Theme’s custom CSS field to the child’s style.css file. The test site url is http://www.AxiomAction.com/testsite , and the padding is back. Curious as to what you’ll find!

    #15187
    Jason Bobich
    Keymaster

    Yup, that’s all I was asking for — a link to your site so I can see the issue you were having.

    On my end everything is working as it should. I see your CSS applied from your child theme’s style.css and there’s no padding in your header DIV.

    Click to enlarge

    So, is it possible you’re just not seeing the updated result in your web browser? Did you try clearing your browser cache? — Usually a couple of quick refreshes will do this, as well. But if you’re stuck, it doesn’t hurt to clear your browsing cache.

    #15189
    bartwindrum
    Participant

    oh boy, that did it. Thanks. First, I don’t trust Safari much but prefer it’s UI so it’s my always-used browser. Next, I was buffaloed since the site responded instantly to refreshing if I pasted the code back into the theme’s own WP-admin add custom code field. Why the browser accepts and acts instantly on that instruction but not on the same instruction passed via the child theme is a) unknown to me and b) the kind of crazymaking behavior that keeps you and I in relationship :).

    #15195
    Jason Bobich
    Keymaster

    It’s because your style.css is an asset of your website. When the web browser loads a website it caches most assets — images, javascript files, CSS files, etc. This allows you to browse the current website faster, as you go page to page. However, when you insert into the “Custom CSS” option, it’s just inserting into the HTML markup of the page. Browsers don’t cache this, as it’s expecting the content (or HTML markup) of each individual webpage to be different.

    #15206
    bartwindrum
    Participant

    so much to understand, let alone remember (hah!).

    #15220
    Jason Bobich
    Keymaster

    Well I guess that’s the true price of creating your own website and not paying someone else to do it. 😉

Viewing 13 replies - 1 through 13 (of 13 total)
  • The forum ‘Akita Responsive WordPress Theme’ is closed to new topics and replies.