Lower and resize text in Hemmingway Rewritten Header

mccoycounselling · Member · Jan 25, 2016 at 9:12 pm
Copy link

Add topic to favorites
hello,

I’d like to lower my title in my header without changing the size of the header. Would I use padding for this? I’m using the Hemingway rewritten theme. I’s also like to reduce the size of the text – is the title h1? I’m new to css……
Thank you!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jan 26, 2016 at 7:05 am
Copy link
Hi there, the location of the site title is done with top and bottom padding of 10%. Add the following CSS and see what you think, which keeps the overall total top/bottom padding (20%) but makes the bottom 0 and the top 20%.
```
.site-header-image {
    padding-top: 20%;
    padding-bottom: 0;
}
```
For the site title font size, yes it is h1, but it is adjusted separately from other h1 elements. Since you are using custom fonts, this would be the CSS you would need. You can adjust the size as desired. 48px is what it is now.
```
.wf-active .site-title {
    font-size: 48px;
}
```
staff-jeanpierreac · Staff · Jan 26, 2016 at 7:10 am
Copy link
Hi there!

I’d like to lower my title in my header without changing the size of the header.

Well, this is in yous .site-header-image. This div has your pic as a background and uses a 10% padding to the top and to the bottom. You can modify it to 18% to the top and 2% to the bottom, keeping the global 20% to avoid resize (Or, of course, tune these values to adjust them to your needs). The css code you would be something like…
```
media="all"
.site-header-image {
    padding: 18% 0 2% 0;
}
```
I’s also like to reduce the size of the text – is the title h1?

Yes! It is a H1 element. But you should be more specific to avoid your modification to be applied to any H1 in your web and to avoid any other rule applied to another H1 acting on your title. So, I suggest you to use the following selector: h1 with .site-title class inside a .wf-active class element. Something like:
```
.wf-active h1.site-title {
    font-size: 36px;
}
```
(Of course, adjust size to your needs!)

Hope this helps!
staff-jeanpierreac · Staff · Jan 26, 2016 at 7:11 am
Copy link
Sorry, @thesacredpath… I already have started to write when you posted your answer :)
thesacredpath · Member · Jan 26, 2016 at 8:34 am
Copy link
staff-jeanpierreac, no worries, that happens to everyone from time to time. Again, thanks for your help in the forums. :)
staff-jeanpierreac · Staff · Jan 26, 2016 at 12:57 pm
Copy link
@thesacredpath :) (I really enjoy doing it!)
mccoycounselling · Member · Jan 26, 2016 at 6:07 pm
Copy link
Excellent! Thanks to both of you!

One more (hopefully quick) question. I noticed on another forum that I can make the black box have a slightly transparent look. When I bring it back by removing: “background: none repeat scroll;” I notice that it still large enough to accommodate for the tagline. What css is required to make the box transparent, but be small enough that it will just go around the title of my site?
mccoycounselling · Member · Jan 26, 2016 at 6:09 pm
Copy link
…..I’m guessing this depends on the font-size I choose?
thesacredpath · Member · Jan 27, 2016 at 4:44 am
Copy link
Hi, change your site branding rule to this
```
.site-branding {
    background: rgba(0, 0, 0, 0.5);
    display: inline-block;
}
```
and then add this to make the site description div go away, which is still there holding space.
```
.site-description {
    display: none;
}
```
mccoycounselling · Member · Jan 28, 2016 at 7:07 pm
Copy link
That’s great – thank you so much. Is there a way to make the box smaller?
thesacredpath · Member · Jan 28, 2016 at 9:32 pm
Copy link
Sure, we can do that. Add this to the .site-branding rule in your CSS.
padding: 1.7em 1.7em 1.7em 1.7em;
The order of the values is top, right, bottom, left. You can adjust them all separately to get the spacing you like.
mccoycounselling · Member · Jan 29, 2016 at 9:23 pm
Copy link
Excellent! Thank you so much for the help!
thesacredpath · Member · Jan 29, 2016 at 10:25 pm
Copy link
You are welcome.

No items found.