[Jon Bellah]

The image you uploaded has a bunch of padding at the bottom. Without uploading a new image, you can find the #main_logo selector in the style.css file and change it so that it reads:

#main_logo {
    height: auto;
    width: 220px;
}

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Oops, double posted somehow.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

In your CSS find the body selector. Currently it reads:

body {
font-weight: 300;
}


Change it so that it reads:

body {
font-weight: 300;
background-color: #ccc;
}


---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

So the easiest way to get the menu to center, is to add this to your CSS:

#subnav .wrap {
width: 835px;
margin: 0 auto;
}


Note: The 835px is the current width of your menu. If you add any menu items, you'll want to readjust.

Sort of a hacky way of doing it, but it works.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Whoa, clearly I can't read. Sorry about that.

1. Add this to your CSS:

#title a:hover {
background: none;
}


2. In your CSS find:

.page h1,
.post h2 a,
.post h2 a:visited {
border-bottom: none;
color: #fff;
display: block;
font-size: 40px;
line-height: 40px;
text-transform: uppercase;
}


And remove the text-transform:uppercase; part.

3. In your CSS find:
#subnav li a:hover,
#subnav li a:active,
#subnav li:hover a,
#subnav .current_page_item a,
#subnav .current-cat a,
#subnav .current-menu-item a {
color: #222;
}


And change color: #222; to color: #fff;

4. I'm going to have to play around with this one... I'll let you know when I get an easy solution.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Could you please post a link to your site? It's much easier to give specific help.

 

Thanks!

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

how can I remove the auto center?
You have the ad wrapped in tags.

1, NOT having ads or things i display in the ad blocks load at all because I believe it is against adsense policies
Check out ResponseJS, it may be able to do what you're looking for. It should also have documentation to help you set it up.

That's about as much as I can help you. Sorry.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Your Genesis child theme. Not the actual Genesis theme.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

I don't know the particular policy for AdSense. That's something you'll have to read up on.

You would just place the HTML in a widget, then manipulate it with the CSS in your style.css file.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

The easiest, but not necessarily the best, way is to wrap your large ads in a div and your mobile ads in a div. Then use css to turn them on and off, based on viewport size. That would look something like this:

Add to functions.php:

// Add Viewport meta tag for mobile browsers
add_action( 'genesis_meta', 'add_viewport_meta_tag' );
function add_viewport_meta_tag() {
	echo '<meta name="viewport" content="width=device-width, initial-scale=1.0"/>';
}

The HTML:

<div class="ad-large">
    <!-- Your Large Screen Ad Code Here -->
</div>

<div class="ad-mobile">
     <!-- Your Small Screen Ad Code Here -->
</div>

The CSS:

.ad-large {
     display: block;
}

.ad-mobile {
     display: none;
}


@media only screen and (max-width: 480px) {
    .ad-large {
        display: none;
    }

    .ad-mobile {
        display: block;
    }
}

Keep in mind, though, that display:none; doesn't keep the browser from loading the hidden content. So you're still going to be loading the large and small ads, regardless of whether or not they're being shown.

So, if you want to get a little better with your performance optimization, you can use something like ResponseJS to only load certain elements based on the viewport size.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

That's a more complicated question than you may think. It's also one that doesn't (yet) have a clear answer. Here's an article from Smashing Magazine that should point you in the right direction, though.

http://mobile.smashingmagazine.com/2012/11/29/making-advertising-work-in-a-responsive-world/

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Find the selector that currently reads:

.enews-widget {
background-color: #e7e7e7;
border: 9px solid #ddd;
margin: 0 10%;
}

And change it to read:

.enews-widget {
background-color: #e7e7e7;
border: 9px solid #ddd;
margin: 48px 10%;
margin: 3rem 10%;
}

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

EDIT: Sigh, double post.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Please provide a link to the issue. It's hard to tell exactly what the problem is if we can't see the problem in action.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Change the color in the #content selector. It currently looks like:

#content {
float: left;
padding: 30px 60px 10px;
width: 680px;
}

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Ah, don't feel horrible. To each their own! I, personally, find it harder to work with premades than blank templates.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Hey, yeah that's a blank theme that I use as a jumping off point for developing stuff with Genesis. The theme for CSS Forge isn't available for download (yet... I'm considering it).

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Thank you! It is running on Genesis 1.9, which is also what Reflex is built for. And I would love for you to try it out!

Also, thank you for subscribing. I really appreciate it.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

Thank you, so much! That means a lot. And don't worry, it was a long weekend of working on it... one that I doubt my girlfriend will let me do again anytime soon. Haha

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Jon Bellah]

LiveFyre is a pretty good alternative to the default WP commenting system. It's pretty painless to set up, too.

---

Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

[Author]

Posts