CSS: Need help with logos, navigation and margins

pakdroid · Member · Nov 8, 2012 at 2:14 pm
Copy link

Add topic to favorites
I’m thinking of purchasing the Custom Design upgrade soon, so I thought I would try the features first.
I need help adding a logo instead of the header text. Please can someone write a CSS code with this logo image:

Second, I want another navigation bar. Preferably on the top.
Also, how can i change the highlight color when I hover over a menu?

Lastly, I need to make a larger body margin for my blog. Please guide me with all these problems.

Thanks in advance!

The blog I need help with is: (visible only to logged in users)
designsimply · Member · Dec 4, 2012 at 10:20 pm
Copy link
I need help adding a logo instead of the header text. Please can someone write a CSS code with this logo image:

I see that you tried adding it as a background image, which gets you close! I would recommend setting the image as a background in the header instead. Here is some CSS to get you started:
```
#header-wrap {
	background: url('http://pakdroidinfo.weebly.com/uploads/1/3/8/3/13835343/1350395703.png') no-repeat;
}
```
designsimply · Member · Dec 4, 2012 at 10:24 pm
Copy link
Second, I want another navigation bar. Preferably on the top.

You can’t really use CSS to add something that’s not there, but you can re-position things that are there. Aside from that though, why do you need a 2nd navigation bar? From a usability perspective, I’d say it’s probably not needed.
designsimply · Member · Dec 4, 2012 at 10:25 pm
Copy link
Also, how can i change the highlight color when I hover over a menu?
```
#top-menu li a:hover {
	color: red;
}
```
Change the color name to a color code of your choice:
http://automattic.github.com/Iris/
designsimply · Member · Dec 4, 2012 at 10:28 pm
Copy link
Lastly, I need to make a larger body margin for my blog. Please guide me with all these problems.

I’m not 100% sure what you mean here. Do you mean larger padding inside the main content area like this?
```
li.type-post, div.type-post, .type-page, .home-post, .featured {
	padding: 20px
}
```
Or do you mean you want to make the entire content area thinner or wider?
mikeperazzetti · Member · Dec 25, 2012 at 1:53 am
Copy link
designsimply,

I am not certain what androidempirepk is attempting to do, but I have a similar issue. I want to make the entire content area wider (at least on the right side. The left side is acceptable I believe.) I am using the Tarski theme and my web site is here: http://mikeperazzetti.com/

Can you help? I have dug everywhere lately, I can find nothing that works, the best way to do it, or where it should be done and how. I appreciate all of your help. Thank you.
designsimply · Member · Jan 1, 2013 at 9:35 pm
Copy link
I updated your help request with the correct URL for your blog: http://mikeperazzetti.com/

This forum is for WordPress.com blogs. Your blog at http://mikeperazzetti.com/ is using WordPress, but it is not setup here at WordPress.com.

To get you started, here is some CSS you can try out to expand the left column:
```
body .primary {
    width: 80%;
}

#sidebar {
    width: 16%;
}
```
In your case, I would recommend using the CSS Editor that comes with the Jetpack plugin to make the change. If you need help learning how to use it, this is the forum you’ll want:
http://wordpress.org/support/plugin/jetpack

If you need further help, you should try asking at a volunteer based forum such as http://wordpress.org/support/ or a CSS forum that is open since this one is only for WordPress.com blogs.

No items found.