Community Forums › Forums › Archived Forums › Design Tips and Tricks › Styling on archives pages only
Tagged: archives, css, lifestyle Pro
- This topic has 9 replies, 2 voices, and was last updated 8 years, 8 months ago by msongbird.
-
AuthorPosts
-
August 10, 2015 at 8:23 am #161931msongbirdParticipant
Hi,
I am using Lifestyle Pro. I have set up a custom archive page which allows me to show all my archives pages in a grid way. Wonderful.
But the entries on the archive pages get their styling from the main content page (in stylesheet called as .content. entry). I want to change the padding of my archives grid without changing the main content padding.I have tried just about anything but I can't find how to call the archives pages and the content padding on those pages in my stylesheet.
Anyone?
Thanks, Marianne
http://www.songbirdblog.comAugust 10, 2015 at 9:54 am #161939Brad DaltonParticipantView the source to find the body classes where you'll find the class for the archive
Link to your custom archive page please.
Another option is to add a custom body class directly to the custom archive file or conditionally from your functions file.
August 10, 2015 at 10:42 am #161948msongbirdParticipantHi thanks of replying.
I tried both ways (using some of your tutorials btw) but I can't get it to work.
I have tried every possible combination of .archive, .archive-page etc that I could think of and that my source code seemed to use, but however I try to 'call' that archive page in my stylesheet it doesn't respond.
I am mainly concerned with the padding of the items on that page, it inherits it from the main content and I want to change it on archives pages only.here is an example of one of my archive pages:
http://www.songbirdblog.com/inspiration-file/August 10, 2015 at 10:51 am #161950Brad DaltonParticipantTry either of these 2
<pre
.category-inspiration-file
.category-82
August 11, 2015 at 4:24 am #162016msongbirdParticipantHi thanks,
moving my css to a different part of my stylesheet solved most of my problems.
I am now capable of making changes to the archives file (like removing meta data and the content title font).
BUT
These lines simply do not work:
.archive .post {
display: inline-block;
width: 25%;
padding: 2%;
}
.post does not seem to 'call' the entries on the page. I have tried alternatives like .content .entry , .article, .entry-content, and every other possibility or combination I could think of. But those entries just don't budge, I can't make them go inline block, nor can I make them change their padding, or do anything else (I even tried display: none; just to double check ). I also tried adding !importantSo how to I ' call ' the entries on my archive page?
Any ideas?
See it here not working:
http://www.songbirdblog.com/decorating-gallery/August 11, 2015 at 4:28 am #162017Brad DaltonParticipantLooks like you got it working? Or not?
You don't need to create a custom category archive file to style the archive differently.
August 11, 2015 at 4:33 am #162019msongbirdParticipantSeems like our responses crossed.
I removed the custom archive page, just to make sure their were no conflicts. I am not trying to do it via CSS and it seems the problem lies with the css code entirely. See my previous response.
August 11, 2015 at 11:41 pm #162116msongbirdParticipantResolved.
For future reference for anyone else running into this question.
I got it to work by adding the same code in twice in a row in my stylesheet.
.archive .post {
display: inline-block;
width: 25%;
padding: 2%;
}
.archive .post {
display: inline-block;
width: 25%;
padding: 2%;
}Don't ask me why but when I accidentally added it twice it worked, when I deleted the first (or second) occurrence it stopped working. So now I have two code bits and I added my customizations to the second and everything is working.
For the life of me I can't understand this, but as long as it is working I am okay with it.August 12, 2015 at 5:57 am #162126Brad DaltonParticipantAugust 13, 2015 at 8:17 am #162247msongbirdParticipantYes! It was your code I was fighting with.
Look at how it looks now:
http://www.songbirdblog.com/decorating-gallery
Pretty proud of that. Now to get the shortcode working in the description section......
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.