SomewhatRounded

Hey again!

It can be a tricky one ??

The spot you’re trying to move it to is taken by the social icon area, so if you float it to the right and the tagline to the left you’ll be good to go!

.social-block {
    float: right;
}
.navbar-wrapper .navbar h2 {
    float: left;
    text-align: left;
}

Cheers! Let the fun continue!

Hey Erskine78!

To get rid of the box-within-a-box thing, you can change the background colour and remove the box-shadow of the menu box like so:

.navbar-inner {
    background: #f0f0f0;
    box-shadow: none;
}

And then the rest of the header can be changed to match using this:

.tc-header {
    background: #f0f0f0;
}

There’s a few different ways you could get rid of the effect for the home page featured items, I think the easiest in this case would be to have a copy of your homepage in your Child Theme (instructions if you aren’t using one already: https://codex.www.ads-software.com/Child_Themes) and remove the “round-div” class from the links.

It would look like this before removing it:

<div class="thumb-wrapper ">
    <a class="round-div" title="News" href="https://refundfees.com/the-facts/"></a>
    <img class="attachment-medium wp-post-image" width="185" height="240" alt="Empty HOV Lane copy" src="https://refundfees.com/wp-content/uploads/2014/06/Empty-HOV-Lane-copy.jpg">
</div>

And last, but not least, the footer colour can be changed using this:

.colophon {
    background: #f0f0f0 !important;
}

Whew! Have fun!

Ahh, nvm, I think I found it from your other post (kinda creepy, eh? haha)

The one you’d be looking for would be .postcontent, so this:

.postcontent {
    background: #fff;
}

Would turn the post backgrounds white, and as an extra touch you can even use .page-header to have it match, so it would then be:

.postcontent, .page-header {
    background: #fff;
}

Cheers!

Where there’s a will, there’s a way!

Can you post your site’s url so I can take a look? ??

Mathcore! (Hardcore math? Math league? haha)

There’s just a little extra margin space there ??

If you set the margin to 0 for #featured it’ll fix it up! Changing the max-width for the iframe should get that to fit within the area as well ??

#featured { margin: 0; }
iframe { max-width: 100%; }

Let me know if that does the trick!

You should be able to download a fresh copy with your new theme name and then use a copy of your stylesheet without a problem ?? As long as everything matches up you’ll be good to go!

Update!

I missed it the first time around, but if you’re just starting from scratch with _s, you can create the theme with whatever name you’d like right from the site: https://underscores.me/

If you hit that “Advanced Options” link underneath the spot to type in the name you can even enter your other info for the theme ??

Woohoo!

So close! (and that’s an impressive amount of lakes!)

This should fix that up:
.js .main-nav { background: none; }

Actually, the other element bug, Firebug is pretty great for finding this css stuff ?? Chrome has a built-in inspector as well, or of course the forums are always here!

Cheers!

Hey mnwaterbug! (Minnesota WaterBug? Am I close? haha)

You can change the background using some good ol’ css ??

If you’re using a Child Theme, or a custom css plugin (so you don’t lose your options when the theme updates), you can use this:

.menu {
background: url(yoururlhere);
}

You could change the hover effect afterwards to match using something like this:

ul.menu > li:hover {
background: none;
}
.menu a:hover {
background: none;
}

*Both* of those have to be changed for it to work show up the right way. That will remove the hover background colour completely, but if you wanted to do something else with it, just let me know!

Happy customizing!

Hey Kabeljau!

There’s a few different options, if you want the arrows resized at different resolutions, the best way would be to take advantage of media queries in your css, or dynamically size the image, using percentages rather than pixels.

The other way would just be to remove the margin from the right (for the div you’ve created), you can also change the z-index (which is like the layering system of css) to make sure it isn’t breaking through your content area.

It would look a little something like this:

#pfeile {
margin-right: 0px;
margin-top: -1240px;
overflow: hidden;
height: 1500px;
float: right;
}

The second float you have in there for bottom can be removed (it isn’t supported). If it was there to try to keep the arrows from coming to an end, that shouldn’t be a problem (the image itself is quite large), but you could also add this to your css:

#pfeile img {
min-height: 100%;
}

That will make sure it’s covering all of the space ??

Hope that helps!

It sounds like it would all have to be changed, but I think for what you’re trying to do you might just want to create a Child Theme (here’s how to do that: https://codex.www.ads-software.com/Child_Themes)

The Child Theme will let you build off of that original theme without having to make a load of changes (and you can name it whatever you want!)

Looks like you’ve got it!

I can’t see the author’s name anywhere there, but if I missed it, can you post a link to the page where it’s showing up?

If nothing related the name was changed, it could be a syntax error that’s causing some weirdness (something as small as a missing semicolon or curly brace), *or* it could be as easy as clearing your browser’s cache to get the freshest version of your site showing.

Nope, quitters never win! ha

That one was actually my bad, the styles there are coming from the Font Awesome stylesheet which is higher in the hierarchy of stylesheets to listen to than your style.css, so if you go to your social-widget.php and add the styles inline there (right in the tag), like style="line-height: 30px !important; margin-top: 5px;"

Or, what would likely be easier at this point would be to go to your social-widget.php file and just replace the existing icons with new ones from FontAwesome. So every time there’s an icon-something, replace the icon with fa (here’s a screenshot: https://monosnap.com/image/YYfQByigoaqeP2SzRA3Ekgw4TAFhvm)

A smidgeon, due to the two different setups!

It’s a bit hacky, but instead of re-doing all of the icons you could add this to your css:

.fa {
    line-height: 30px !important;
    margin-top: 5px;
}

One day you’ll have all of your icons, and have them aligned! haha

Whatwhaaaat

I think I’ve gotten it! In your child theme, if you have header.php, add in this line before the closing head tag (</head>):
<link href="//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

It seems like it’s just something to do with the way the theme uses the font, so if you add that into your header and then the class for your icon that you added from the tutorial, would be “icon fa fa-plus”

Now it should be there!