[jbergen]

Hi,

I'd be happy to try to help, but I'm getting a 403 Forbidden error when I click on your link.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Oh, and you'll also want to remove the width: 600px; line for that same element from the max-width 1180px media query:

style.css, line 2080:

.site-header .widget-area {
    width: 600px;  ***remove this***
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

You can fix that by removing the width: 740px; line from style.css, line 1102. You might also want to adjust the top padding to get its vertical positioning right.

style.css, line 1102:

.site-header .widget-area {
    float: right;
    padding-top: 30px;
    text-align: right;
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi there,

The reason it's disappearing is because of a display: none; rule in the media query for max-width 768px:

style.css, line 2138:

.genesis-nav-menu.responsive-menu, .genesis-nav-menu.responsive-menu > .menu-item > .sub-menu {
    display: none;
}

If you remove that display: none; it should not go away.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi there,

The black background in your footer comes from style.css, line 1656:

.footer-widgets {
    background-color: #222;
    color: #C8C8C8;
    clear: both;
    font-size: 1.4rem;
}

You just need to change the background-color line.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

You can reduce that white space by reducing the minimum height of .site-header on style.css, line 854:

.site-header {
    background-color: #FFF;
    min-height: 100px;
}

You can remove a little more by changing style.css, line 859:

.site-header .wrap {
    padding: 10px 0 0;
}

I hope that helps!
Jamie

---

Jamie @ Ladebug Studios

[jbergen]

I'm glad it worked out!

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

I don't think it's in a CSS file. It appears to be inline in your HTML. When you write blog posts, which tab in the editor are you using? Visual or Text? Assuming you're using the Visual tab, try switching to Text to see that HTML tag that I pasted into my last reply. If you find it, you can make the changes I mentioned.

The question of why it's happening to all of your blog post your images is a slightly larger issue. Assuming you're not manually inserting all of that inline style stuff, can you think of a plugin you're using that might be doing it?

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi!

The problem is related to a couple of unnecessary inline style rules in your img tag. First, remove style="display: inline;" and remove lazy after class="... from the HTML used to display the blog post image (see below):

Before the change:

<img scale="0" src-orig="http://i1.wp.com/www.anthonygalli.com/wp-content/plugins/jquery-image-lazy-loading/images/grey.gif?resize=300%2C215" style="display: inline;" class="lazy wp-image-1784 size-medium aligncenter" src="http://www.anthonygalli.com/wp-content/uploads/2014/09/rules-2-300x215.jpg" data-original="http://www.anthonygalli.com/wp-content/uploads/2014/09/rules-2-300x215.jpg" alt="rules-2" height="215" width="300">

After the change:

<img scale="0" src-orig="http://i1.wp.com/www.anthonygalli.com/wp-content/plugins/jquery-image-lazy-loading/images/grey.gif?resize=300%2C215" class="wp-image-1784 size-medium aligncenter" src="http://www.anthonygalli.com/wp-content/uploads/2014/09/rules-2-300x215.jpg" data-original="http://www.anthonygalli.com/wp-content/uploads/2014/09/rules-2-300x215.jpg" alt="rules-2" height="215" width="300">

Then remove the spaces you had to add before the image, and the .aligncenter class given to the image when you click "align: center" should work.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

You don't really need specific technical knowledge to install and set up a Genesis child theme. Assuming you're purchasing the child theme from StudioPress, they provide very detailed instructions on how to set up each of their child themes. That being said, if you want to make modifications to the theme, you may or may not need to get into the code. There are some free plugins (like Genesis Simple Edits) that let you modify some basic elements (e.g., the post-info (byline), the post-meta, and the footer area). If you're looking to make more extensive changes and you want to stay away from the code, you might consider Genesis Design Palette Pro. It's not free, but I've heard great things about it.

I hope that helps. Feel free to follow up if you have more specific questions about a particular theme.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

It looks like the first issue is that the header widget falls below and to the right of the logo at 1023px. To fix that, you can adjust the width of the .title-area (logo) in that media query. If you add the CSS below to style.css at the end of the max-width 1023px media query, the header widget will stay to the right of the logo (and not fall below) on iPad-sized screens.

.title-area {
	width: 50%;
}

Then in the max-width 767px media query, you can make the logo and header widget stack and center by adding/removing the following code:

Remove:

.header-image .site-title a {
    background-size: contain !important;
    float:left!important;
}

Add:

.site-header {
    text-align: center;
}

.site-header .widget-area {
    float: none !important;
    width: 100% !important;
    clear: both;
}

.title-area {
    float: none !important;
    width: 100%;
}

.header-image .site-title a {
    background-position: center !important;
}

I hope that helps!
Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

You can give the widget areas more of a top margin in style.css, line 1405.

Here's my suggested revision:

.welcome-feature-1, .welcome-feature-2 {
    float: left;
    margin: 20px 2% 0px 0px;
    width: 45%;
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

The font color for the body text on your site is set in style.css, line 145. If you change color: #A5A5A3; to something like color: #707070;, it will make the font darker. The font type is also defined there as the font-family.

style.css, line 145:

body {
    color: #A5A5A3;
    font-family: "Droid Sans",sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.625;
}

I hope that helps!
Jamie

---

Jamie @ Ladebug Studios

[jbergen]

When you say you're entering it in the regular control panel, do you mean you're writing in the text editor to create a page or post?

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

I don't think the code is in your stylesheet. How are you adding the word "Test" to your entry header? Are you using a widget? I'm just trying to figure out where those <font> tags are coming from.

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

I don't think it's a problem with your stylesheet. The default text color appears to be #333. However, there is inline CSS that appears to be making the text white. I'm copying a portion of your HTML to show you what I mean. When I changed #ffffff to #33333, the text appeared.

<header class="entry-header">
    <h1 class="entry-title" itemprop="headline">
        <font size="3" color="#ffffff">
            <font size="3" color="#ffffff">
                Test
            </font>
        </font>
    </h1>
...
</header>

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

If you add clear: both; to .home-top, it will cause the image to slide down.

style.css, line 1324:

.home-top {
    border-top: 1px solid #ECECEC;
    clear: both;
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi,

It looks like the wrap div inside your site header is pushing your responsive menu out of the way. If I add display: none; to that wrap div in the max-width 1023px media query, the menu appears.

style.css, line 2080

.site-header .wrap {
    padding: 20px 5%;
    display: none;
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Glad that centered it! To get rid of a lot of that white space, you can change style.css, line 871 to:

.site-header .wrap {
    padding: 0;
}

Jamie

---

Jamie @ Ladebug Studios

[jbergen]

Hi Barb,

I think the header/sidebar (I'm also not sure what to call it!) in that theme is meant to be very short. However, you can at least make it easier to view the whole thing by removing position: fixed; from the CSS for site header (style.css, line 747). That way, when you scroll down the page, you can see the bottom part of the header/sidebar. The tradeoff is that the header/sidebar won't stay stuck to the top of the page as you scroll down the posts in the main column.

Let me know if you wanted to approach it a different way, and I can try to help.

Jamie

---

Jamie @ Ladebug Studios

[Author]

Posts