Header picture has black around it..

Hey there,

If you have a custom css option or a plugin you can use these css codes and it should fix the problem.

#header h1, #header h2 {
font-size: 48px;
margin: 5px 10px 0;
padding: 38px 0 123px 0;
background: url(images/header-btm.png) no-repeat center bottom;
text-align: center;
line-height: 0.9;
text-shadow: 0 1px 1px #000;
}

#header-desc {
color: #ddd;
padding: 0 10px 35px;
margin: 0 auto 0;
display: block;
max-width: 600px;
text-align: center;
background: transparent url(images/header-desc.png) no-repeat bottom center;
letter-spacing: 1px;
text-shadow: 0 1px 1px #000;
}

Hope it helps! ??

I know how to edit code a bit. But not sure where to put this code? Hope you can help out more Niko. Thanks!

Niko – I found it under Stylesheet (style.css) and changed it with what you said. But, it doesn’t work. ??

Hey there Stimpdawg

You will need a custom css plugin or a child theme to achieve this safely so that future updates won’t ruin the changes.

When using child theme or a plugin those css codes will overwrite the parent and they should work. I guess the problem is that the code isn’t really overwriting the code.

You can actually do this also if that won’t work:

#header h1, #header h2 {
font-size: 48px;
margin: 5px 10px 0;
padding: 38px 0 123px 0;
background: url(images/header-btm.png) no-repeat center bottom;
text-align: center;
line-height: 0.9;
-webkit-box-shadow: 0 0px 0px #000;
text-shadow: 0 1px 1px #000;
}

#header-desc {
color: #ddd;
padding: 0 10px 35px;
margin: 0 auto 0;
display: block;
max-width: 600px;
text-align: center;
background: transparent url(images/header-desc.png) no-repeat bottom center;
letter-spacing: 1px;
-webkit-box-shadow: 0 0px 0px #000;
text-shadow: 0 1px 1px #000;
}

This is the line that is making that line on chrome ??
Default: -webkit-box-shadow: 0 1px 1px #000;
Modified: -webkit-box-shadow: 0 0px 0px #000;

Thanks for all your help Niko. I can’t seem to get the picture full screen. I know it’s the dimensions of it.. but the theme should work correctly. I think I’m going to skip using this WordPress theme and use one that functions right.

Hey there Stimpdawg,

Oh you just wanted the whole picture full screen. I thought you meant the wierd lines on just chrome. Just the upper image could work if you add like 1920 x 390 picture on there.

Really sorry about the confusion.

960px is the same width as the main area. 1920 width is abit over the regular area but it should scale down depending on visitors browser.

Hey NikoV,
Thank you, your answer completely worked for me to get rid of the black outline!! I am thrilled. Thanks!