Help With CSS - Can't centralize my logo on WP.

Hey guys,

Hope everybody is good today.

I'm building a site for a friend and they have decided they want the logo in the middle instead of on the left as is default.
I've changed the code in my CSS but it doesn't seem to have helped! Does anybody know what is wrong with the code below?

the demo site is futurefitfamily.com

and the code is :

#top{height:100px; border-top:solid 2px #2d84b6; padding:0px 0px 0px 0px}
#logo{padding-top:18px; width:690px; float:center;}
#logo h1, #logo h1 a, #logo h1 a:visited{font-size:48px; color:#2d84b6; margin-bottom:0px;}
#logo h1 a:hover{text-decoration:none;}
#logo .t1{color:#656253;}
#logo .desc{color:#7c7a6b; font-size:14px;}
#logoimage{ width:690px; float:center; height:100px;}

I have bolded the modifications I've made to the code. It used to be float:left

Did I do this wrong?

Also brownie points for anybody who can tell me the code to have the logo show up bigger the image is bigger but the theme auto-resizes it I think.

Thanks a million for any help. I appreciate it

Al

 

You can't float center.
You should remove the floats for the logo and add this: margin:auto;

 

Awesome Kevy, thanks a lot! That's definitely got it moving. It's not quite exactly central though - Anything I can add to move it along to the right a little more?

Thanks a lot for your quick response. You rock!

 

If you want to move the img right add padding-left: (amount)px;

 

Thanks a bunch, that did it!

 

Good job.

You can use padding-left:10px, padding-right:10px or margin-left:10px, margin-right:10px and give it a value depending on how many pixels you want it moved.

 

Thank you, I managed to get it where I wanted by playing with the figures

Does anybody know the fix for my bonus question? lol I have saved the logo image in Wordpress in my library as 371 × 151 sized image but when I inspect the element on my homepage it says the image is 246 x 100. I'd like it full size. This is the code I get when I inspect the element. Just underneath the <div id="logoimage"> tag

<img src="http://futurefitfamily.com/wp-content/uploads/2012/05/logo_comp-copy3.png" alt="" height="100">

I assume the alt height 100 is something to do with it but I can't see anything in the CSS file under #logoimage that I can alter. How can I just get WP to leave the logo full size?
Btw I add the logo in via the theme options.

Thanks if anyone can solve this as well

 

What code do you actually use? If you use CSS to define the location of the logo, make sure to precise the width and height. If you use <img /> (it has to be self closed, otherwise it may cause problems, like errors in validation), either just remove height="" and width="" or put the right values. Simple!