• Maybe a stupid question, but where do you change the size of your text in the header and footer?

Viewing 15 replies - 1 through 15 (of 15 total)
  • style.css

    The exact location varies depending on theme

    Thread Starter MJ14

    (@mj14)

    Yeah that’s really all I was looking for. I have been through different .css stuff on my web site and I only have to fix the text now and I just forgot where the text size is edited. Been a long couple of days, thanks for the answer. I will find it in the style.css! I appreciate it!

    Thread Starter MJ14

    (@mj14)

    http://whimsicallydark.com/
    Well, this is the website I am editing. I want to edit the text size in the header and in the titles that say recent products and shop. I have edited the style.css as best as I know how to. But there’s a css/text.css import in the style.css that is coded like this:

    /* -------------------------------------------------------------- 
    
    typography.css *
    Sets up some sensible default typography. *
    Based on the typography.css portion of Blueprint CSS @ http://blueprintcss.org/ 
    
    -------------------------------------------------------------- */ 
    
    /* Default font settings. The font-size percentage is of 16px. (0.813 * 16px ~ 13px) */
    body {
    	font-size: 81.3%;
    	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
    }
    
    /* Headings -------------------------------------------------------------- */
    
    h1, h2, h3, h4, h5, h6 {
    	font-weight: normal;
    }
    h1 {
    	font-size: 3.3em;
    	line-height: 1;
    }
    h2 {
    	font-size: 2.5em;
    }
    h3 {
    	font-size: 1.5em;
    	line-height: 1;
    }
    h4 {
    	font-size: 1.2em;
    	line-height: 1.25;
    }
    h5 {
    	font-size: 1em;
    	font-weight: bold;
    }
    h6 {
    	font-size: 1em;
    	font-weight: bold;
    }
    h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
    	margin: 0;
    }
    
    /* Text elements -------------------------------------------------------------- */
    
    p {
    }
    p img.left {
    	float: left;
    	margin: 1.5em 1.5em 1.5em 0;
    	padding: 0;
    }
    p img.right {
    	float: right;
    	margin: 1.5em 0 1.5em 1.5em;
    }
    a:focus, a:hover {
    }
    a {
    	text-decoration: underline;
    }
    blockquote {
    	font-style: italic;
    }
    strong {
    	font-weight: bold;
    }
    em, dfn {
    	font-style: italic;
    }
    dfn {
    	font-weight: bold;
    }
    sup, sub {
    	line-height: 0;
    }
    abbr, acronym {
    	/* border-bottom: 1px dotted #666; */
    }
    address {
    	margin: 0 0 1.5em;
    	font-style: italic;
    }
    del {
    	/* color:#666; */
    }
    pre {
    	margin: 1.5em 0;
    	white-space: pre;
    }
    pre, code, tt {
    	font: 1em 'andale mono', 'lucida console', monospace;
    	line-height: 1.5;
    }
    small {
    	font-size:0.85em;
    }

    Is it possible the headers or h1, h2, h3 etc. edit the text size of those? If so, anyone know which would edit the Beary Creative text and recent products/shop text?

    I would think the beary creative font size could be made larger here

    #logo {
    	font-family:"DeliciousHeavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
    	margin:10px;
    }

    The best way for you to be truly sure is to use something like firebug addon for firefox, which lets you point to elements on your page, to see what css to edit. You may also have to write your own rules to target things specifically.

    Also, I believe the recent products is handled in this part

    .section-title {
    	font-family:"DeliciousHeavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
    	margin:20px 10px 10px;
    }

    And… I think I may have to buy a painting from you! cool stuff…..

    (I’m at work, and don’t have any dev tools handy, so I’m kind of working blind by reading your markup, so the above may not work I can’t investigate as well as I’d liek to)

    Thread Starter MJ14

    (@mj14)

    Yeah I thought editing the #logo was the solution but this is what I keep getting:

    View post on imgur.com

    If I try to change the size it just moves the text down and doesn’t change the font size. I can change every single other thing except those three I named.

    The thing that may be an issue, is that those particular areas use cufon text replacement. How are you doing that? A plugin?

    I have no idea how that works to be honest….. if a plugin, does it have settings?

    Thread Starter MJ14

    (@mj14)

    Yes cufon text replacement is a plugin that I’m using. You’re right, that may be affecting why it just moves down and won’t edit the actual text. But I did edit the text on the right under the featured title that is replaced with cufon. I also edited the pages and shopping cart titles as well with the cufon replacement and it allowed me to edit the text size. Regardless, it still could be cufon messing those up!

    You could turn off the cufon, edit the css to ensure we are getting the right selector, then reactivate

    At least make sure the css is right…..

    Thread Starter MJ14

    (@mj14)

    Sounds like a good idea, I’ll try that real quick.

    Thread Starter MJ14

    (@mj14)

    Took the cufon out completely and it just moves the text to the left:
    http://i.imgur.com/YIEhL.png

    Is it possible that I just need to move the margin? I doubt it, because it doesn’t even edit the size, but I’ve got nothing…

    What exactky are you doing with the css? If I may see?

    If you are adding font-size to that rule, and it’s not working, perhaps we can get more specific and try:

    #header-menu h1 {
            font-size: 20px;
    }

    and put that under the logo rule, or maybe in your text.css at the bottom (obviously adjust the size as you see fit)

    Thread Starter MJ14

    (@mj14)

    That worked perfectly! I added it like this:

    #logo {
    	font-family:"DeliciousHeavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
    	margin:10px;
    }
    
    #header-menu h1 {
            font-size: 80px;
    }

    Now what would I add for the .section title stuff? Thank you SO much for all the help! When I was editing it, I was just adding:

    #logo {
    font-family:”DeliciousHeavy”, “Helvetica Neue”, Helvetica, Arial, sans-serif;
    font-size:90px;
    margin:10px;
    }

    or something to that effect.

    But that worked perfectly!

    .container_16 h2 {
         font-size: blah;
    }

    May work

    Thread Starter MJ14

    (@mj14)

    Worked perfectly, thank you so much for all the help!

    Ha! cool! Thanks for letting me know, and I’m glad we were able to get it all figured out!

Viewing 15 replies - 1 through 15 (of 15 total)

The topic ‘Text size’ is closed to new replies.