• How do I get the ‘links/copyrights/powered by–‘ in the footer to be centered in the middle of the page? They are automatically to the bottom left of page. Help!

    Id also like to make these links a little bigger. Where can I change font size in this area?

    Thanks,
    Brett

Viewing 7 replies - 1 through 7 (of 7 total)
  • You can change them in the css file. On the #footer, add
    text-align: center

    i am attempting something similar (moving the footer to the RIGHT side of the page, instead of the default which is on the left).

    first, i copied my footer code from the style.css into the child theme, it looks like this:

    /* Footer
    -------------------------------------------------------------- */
    #footer {
    
    	overflow: hidden;
    	clear: both;
    	max-width: 940px;
    	width: 100%;
    	margin: 0 auto;
    	padding: 0 0 30px 0;
    	font-size: 0.9166666666666667em;
    	color: #aaa;
    }
    #footer p { margin-bottom: 0; }
    #footer a { color: #888; }
    #footer a:hover { color: #64a2d8; }
    .footer-left {
    	float: right;
    	width: 70%;
    }
    .footer-right {
    	float: right;
    	width: 30%;
    }
    }
    .footer-left {
    	float: left;
    	width: 70%;
    }

    i noticed i can change the placement of the footer if i change this part of the code:

    max-width: 940px;

    i.e. if I make that 240 instead of 940, it moves it close to the center of the page. Unfortunately it doesn’t look like it’s possible to move the footer to the right side of the page using this method, but i’m sure there is some other way… anyone ever have any luck with it?

    If you post a link to your site, it will be much easier for someone to help you.

    here it is.

    Try adding this:

    #footer .footer-content {
       float: right;
    }

    If you’re not using it, Firebug is the best and super useful way to work with CSS issues like this…

    Thanks yogi, this solved my issue. My code now looks like this

    /* Footer
    -------------------------------------------------------------- */
    
    #footer .footer-content {
       float: right;
    }
    
    #footer {
    
    	overflow: hidden;
    	clear: both;
    	max-width: 940px;
    	width: 100%;
    	margin: 0 auto;
    	padding: 0 0 30px 0;
    	font-size: 0.9166666666666667em;
    	color: #aaa;
    }
    #footer p { margin-bottom: 0; }
    #footer a { color: #888; }
    #footer a:hover { color: #64a2d8; }
    .footer-left {
    	float: right;
    	width: 70%;
    }
    .footer-right {
    	float: right;
    	width: 30%;
    }
    }
    .footer-left {
    	float: left;
    	width: 70%;
    }

    Regarding Firebug, I should probably check out some of the video tutorials. I can use it to locate the particular codes that control particular elements, but can never seem to find which FILES the codes are connected to.

    Firebug shows the files too — right on the right side of the window that shows the styles — blue text links to that file. (At least that’s how it is on the Mac version — not sure if it’s the same on Windows…if that’s what you are using.) The Firebug site also has good documentation, so that might help you out too. Definitely VERY worth spending a bit of time learning it. I could never do anything with CSS without it… It’s also SOO helpful to be able to make CSS changes right in the browser window – -and test them right there without having to make them in the actual code. Then, once you know what works, go make them in the files and save. Big time saver there too.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘[Hatch Theme] Centering Footer Links’ is closed to new replies.