- Subscribe to RSS Feed
- Mark Thread as New
- Mark Thread as Read
- Float this Thread for Current User
- Bookmark
- Subscribe
- Printer Friendly Page
Want to add CSS Striped background to header
Hello! I'm designing a site, https://www.homedesigntransitions.com and I would love a repeating horizontal stripe pattern behind the logo in the entire header area.
I've found CSS for repeating stripes, but nothing is sticking when I try to change the CSS file in Weebly.
Any help would be greatly appreciated!
CSS code:
background-image: repeating-linear-gradient(180deg, #ccc, #ccc 30px, #dbdbdb 30px, #dbdbdb 60px);
or
background: linear-gradient( to bottom, #5d9634, #5d9634 50%, #538c2b 50%, #538c2b ); /* The rectangle in which to repeat. It can be fully wide in this case */ background-size: 100% 20px;
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report
- Subscribe to RSS Feed
- Mark Thread as New
- Mark Thread as Read
- Float this Thread for Current User
- Bookmark
- Subscribe
- Printer Friendly Page
You are pretty much there, it just comes down where to put it. I'm an advocate for putting things in the global header/footer if it is just a simple tweak, especially of this caliber (Settings > SEO). Just wrap what you have in a style tag and you should be good to go:
<style> #sitename { background-image: repeating-linear-gradient(180deg, #ccc, #ccc 30px, #dbdbdb 30px, #dbdbdb 60px); /* background: linear-gradient( to bottom, #5d9634, #5d9634 50%, #538c2b 50%, #538c2b ); */ } </style>
The div that contains your logo has an id called "sitename". This should apply the style you want. Let me know how it works out.
- Subscribe to RSS Feed
- Mark Thread as New
- Mark Thread as Read
- Float this Thread for Current User
- Bookmark
- Subscribe
- Printer Friendly Page
Looking at it again now, you could replace "#sitename" with "#header" to cover the entirety of the logo, but you would have to put more spacing between the header section and the "Welcome" button