Menu Font Size and Box Shading
-
Hello there, I’m trying to play around with my website and customize it to my liking. The first and most frustrating problem I’m having is customizing the font size of my menu items. They’re pretty large, distracting, and they throw off the balance of the entire home page. I’d like to have them be lowercase and a little smaller, but don’t know how to change the CSS accordingly.
The second thing I’d like to do is change the background color of the boxes for my posts. Is there any way to get a shade of green behind my posts on the front page so that it’s not an entire sea of white? Please let me know if there’s anything you can do, I’m at a loss!
The blog I need help with is: (visible only to logged in users)
-
Hello, these are the CSS you will need to fix.
Answer to the first problem:
.nav--main li a {text-transform: initial;}Answer to the second problem:
.site-content article {background: #4bf0cc;}Please respond if you need any further help with CSS.
Thanks
-
Wow! Thank you so much, that’s perfect.
The only thing now is that the text is off-center in the boxes? Is there any way to fix that? Or should I get rid of the shaded background?
-
-
Hi,
I just checked your site.
Looks like the shading thing is a bit off.
This will fix :
@media (min-width: 480px) { .entry-card, .entry--even .entry-card.entry-card--portrait { background: #b3ffe6; }}Remove this old css:
.site-content article {background: #4bf0cc;}For blockquote, you have to add this CSS:
.wf-active blockquote {font-size: 1.0rem;}Let me know if you need anything else.
-
-
-
-
Well, I want the padding around them to be equal. As in, there’s an equal border of green all around it. Does that make sense?
-
Hi,
I will have to tag a staff member here, because most of this CSS fixes need access of your site.
Do not worry, your problem will be solved by the staff soon.
Just be patient.
Thanks
-
-
-
@melaniefalconer, just wanted to let you know I will be working on your issue in just a few minutes for you.
-
-
Hi there, as designed, there was 60px of margin on the left of the content, which didn’t show up until you added the background to the articles. What we can do is to split that 60px half on each side, and then add a bit of top margin to the image. See what you think with the following.
.entry-card .entry-content, .entry-card .entry-image { margin-left: 30px; margin-right: 30px; } .entry-card .entry-image { margin-top: 30px } -
So, I really, really like it! That looks a lot more balanced.
The only problem is when I have portrait-oriented pictures, the images overspill of the side. Is there any way to get the text and the image all snug inside the box like the other ones?
-
-
The only problem is when I have portrait-oriented pictures, the images overspill of the side. Is there any way to get the text and the image all snug inside the box like the other ones
That is actually part of the design of Patch, and although we can do this, it presents problems. Firstly, the title of the post gets very narrow, which means that words are broken within, making it very hard to read the titles, and it also causes some aesthetic misalignment issue. Also, the posts themselves are aligned differently depending on the location and such, and that alignment is calculated by the theme software and then inserted directly into the HTML based on the window/screen width.
My suggestion would be not to use portrait oriented images, only landscape.
- The topic ‘Menu Font Size and Box Shading’ is closed to new replies.
WordPress.com Forums 