How to shrink area with CSS

(Tdot) #1

I’m using the Affinity theme as seen in this link: Affinity Theme

I’d like to shrink the height of the area directly under the navigation bar and above the banner image. The area containing the title text “AFFINITY Michael David Design”

I know this can be adjusted in CSS and am wondering if someone can help out with the code.

Thank you!

(David) #2

This should work:

#titlelogo {
    padding-top: 50px !important;

You can change the 50px as needed. The original setting is 75px.

(Tdot) #3

You’re a hero!
Thanks a lot!

(David) #4

Glad to help and glad it worked for you. :grinning:

(Tdot) #5

1 more question - would you know the CSS that will allow me to shrink in height the area that contains the banner?

(David) #6

I did see this on the page:

(Banner width is set at 960px. Banner image heights are not limited by the theme but determined by you. Recommended height is 400px for proper extra container #2 display).

But i suppose you could also use this:

#featureImg {
    height: 400px !important;

The original setting is height: auto

(Tdot) #7

That code decreases the height of the area but it also squeezes the banner image. I’m wondering if it’s possible to just decrease the height of the area containing the banner, without affecting the banner image?
Thanks again the help!

(David) #8

Do you mean reducing the white space on the top and bottom of the banner?

To reduce the space above the banner:

.tshead {
    padding-bottom: 0px !important;

The original value is 25px.

To reduce the space below the banner:

section #padding {
    margin-top: 0px
    padding: 15px 0 0; !important;

The original value is 40px for margin-top and for padding 45px 0 0.

(Tdot) #9

For some reason those aren’t having an effect.
I’m probably doing something wrong.
Will keep working at it.
Appreciate the help!

(David) #11

This is what I see with that CSS applied:

(Tdot) #12

Totally understand. Unfortunately I can’t publish quite yet as I’d be overwriting the existing site that needs to stay up. Will keep experimenting

(David) #14

Maybe try pasting the CSS as plain text? It might be grabbing the formatting from the forum post.