- This topic has 6 replies, 2 voices, and was last updated 12 years, 5 months ago by
.
-
Posts
-
Hi there,
I'm working with this theme currently, & I know there are quite possibly a number of ways to go about the above - but I was just wondering if anyone could recommend the best way to go about this.
Is it simply to load a different logo depending upon @media queries?
Or is there a smarter way - specifically with regards to this theme.
I would prefer to retain the home link ability of the standard text based header - with logo image replacement.
Thanks in advance,
JasCan you post a link to your site? It's always easier to help if we can see what you see.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+Hey @nutsandbolts - thanks for the reply.
It's actually being developed locally - so the best I can do are the attached screenshots - hope that is of some help?
screenshot one
screenshot two
As you can see, I'm loading a completely different logo should the screen size be max-width: 768px - not ideal.
I'm also keen to have the logo retain it's ahref to home, I'm guessing I'm applying the styles in the wrong place & I should know better, but I'm trying to do too many things at once (it's that time of year) 😉Usually if you're adding the logo manually in the stylesheet, you can add
background-size: contain !important;to the CSS to have the image resize for all screens. It's hard to tell you exactly how that needs to work without being able to see the live site.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+Now that's a css rule I've not come across before - I'll give that a go & see how I get on.
Thanks 🙂Hi @nutsandbolts, I used
background-size: contain !important;& that worked a treat.
Thank you, I'd never come across that css rule before - very handy.Glad I was able to help! If you ever have other CSS rules that should work but don't, try adding !important before the semicolon. Many times that will force it to override whatever is keeping the rule from working.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.