Community Forums › Forums › Archived Forums › Design Tips and Tricks › Quattro Header Customization
Tagged: Quattro
- This topic has 13 replies, 2 voices, and was last updated 11 years, 5 months ago by SoZo.
-
AuthorPosts
-
November 20, 2012 at 4:32 pm #966LauraMiriamMember
I am attempting to adjust the header image on my site. I've read through the forums, the beginner guide, and the setup information (I think). I've manipulated the functions.php and the style.css of the Quattro theme in an attempt to make my header image 900x300 and centered. Unfortunately, it still is only 120 in height and is not centered. Could you help? Thank you!
>
> URL
> http://findcatharsis.comNovember 20, 2012 at 4:40 pm #970SoZoMemberYou need to edit the height of .header-image #title-area, .header-image #title, .header-image #title a or set a height for the #header rule to set the height and to center it you either need to adjust the width of #header or add "
background-position: center !important;" to that rule
John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography
November 20, 2012 at 5:05 pm #975LauraMiriamMemberHmmm. I thought I had done that, but I will start fresh and see if it works. Thanks.
November 20, 2012 at 5:51 pm #997LauraMiriamMemberYeah, I went back in and did this and still it is not working. Any other ideas?
November 20, 2012 at 6:25 pm #1003SoZoMember.header-image #title-area, .header-image #title, .header-image #title a is still at 120px
John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography
November 20, 2012 at 6:32 pm #1005LauraMiriamMemberHere's the code for the header section in style.css:
/* Header
------------------------------------------------------------ */#header {
border-bottom: double #ccc;
margin: 0 auto;
min-height: 325px;
overflow: hidden;
width: 100%;}
#title-area {
float: left;
overflow: hidden;
padding: 0;
width: 580px;
}#title {
font-family: 'Quattrocento Sans', sans-serif;
font-size: 60px;
font-weight: bold;
line-height: 1.25;
margin: 0;
text-shadow: 1px 2px 1px #fff;
}#title a,
#title a:hover {
color: #555;
text-decoration: none;
}#description {
color: #444;
font-size: 16px;
}#header .widget-area {
float: right;
padding: 20px 0 0 0;
width: 0px;
}/* Image Header - Partial Width
------------------------------------------------------------ */.header-image #title-area,
.header-image #title,
.header-image #title a {
display: block;
float: left;
height: 325px;
overflow: hidden;
padding: 100;
text-indent: -9999px;
width: 900px;
}.header-image #description {
display: block;
overflow: hidden;
}/* Image Header - Full Width
------------------------------------------------------------ */.header-full-width #title-area,
.header-full-width #title,
.header-full-width #title a {
text-align: center;
width: 100%;
}November 20, 2012 at 7:41 pm #1013SoZoMemberThere is a different theme active currently
John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography
November 20, 2012 at 7:45 pm #1014LauraMiriamMemberQuattro is now active
November 20, 2012 at 7:48 pm #1016SoZoMemberYOu have a caching plugin activated. Not much of a reason to activate that until after you are done setting everything up.
John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography
November 20, 2012 at 7:49 pm #1017LauraMiriamMemberOk. Deactivated. Let's see.
November 20, 2012 at 7:50 pm #1018LauraMiriamMemberYay! Seems to be working. Once I set things up, may I reactivate the plugin, or will that mess things up again?
November 20, 2012 at 8:38 pm #1035SoZoMemberCertainly. Caching plugins are very useful in speeding up the delivery of your site.
John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography
November 20, 2012 at 8:41 pm #1037LauraMiriamMemberAwesome. Thank you so much for your help!
November 20, 2012 at 9:04 pm #1041SoZoMember -
AuthorPosts
- The topic ‘Quattro Header Customization’ is closed to new replies.