I'm having a problem with the image on my site. www.therecomplife.com I want the Image I made to fill in the black region. I have used firebug but to no prevail. The theme I'm using is called Lucid. I paid for the theme but I did not pay for the support forums. Any help would be much appreciated.
the only black region that i can see is down the very bottom of the page? is that the region you are looking to fill? if so what is the image (provide link please)
I was messing with the code. it is now back to the way it was when I posted this. Its allows me to add a logo but this is as big as the logo will get no matter what dimensions I set it to in photoshop.
Well, you can't do this directly from the theme settings. You will have to alter the code a bit. If you see closely, the header defines the width to a fixed size and under the logo, a margin has been defined. Also, if you are using the theme's built in setting to assign the image, the script might be resizing it upon uploading.
I can't explain in the detail but if you want to fill in the black region with image, try to remove the main-header and logo-area bottom margin property. #main-header margin-bottom: 60px; #logo-area margin-bottom: 57px; And specify the height attribute for image in the <img> tag, (better to use the actual size of the image).
Thank you guys. I edited the css and its looking better. I was looking for more of a way to make the picture bigger instead of the getting rid of the margin's. I know you guys are doing this for free and I appreciate it alot. www.therecomplife.com the theme is updated with your suggested margin-bottom's gone. I want it to be bigger and stretch throughout the whole page.
You have to specify a width for the container first so it doesn't shift around. Then alternatively you can add the attributes to the image. Here's a logic to help you out: <div id="header"> <div id="imageholder" style="width:xxxxpx;height:xxxxpx;margin:0 auto;"> <img src="xxx" height="xxxpx" width="xxxpx" /> </div> </div> Note that you can use the "style" attribute as CSS. This will help. You will not get an image that always fill 100% of the content due to different screen resolutions and the fact that image are ratio based entities.
please forgive me if this is annoying, but I specified a width for the logo container for 2000px, but as you can see my site looks a little "off" lol. as far as the code you provided above I dont know exactly where to put that.
the div id header is shown to be the search bar and social icons, so I don't want to mess with that area.
I just noticed that you're using the responsive template, so I think you don't need to specify both of them. Just edit your image with image editor and (scale/crop) set the width 960px and set the height you desire.
lol oh gawd this theme is bending me over backwards. Did as you suggested but as you can see I'm still left with a website that is horrid. I really am glad that you guys are trying to help me though.
I'm going to dig through the source code. But before you make changes like these, you need to switch off the WP-Supercache. It will not show you the latest version.
You're almost there, you just need to remove the logo container's width (2000px). And redesign your image with dimension 960px X 250px to make it look much bigger as you wish.
Yep..Do this: In your style.css, look for the following: .container #logo-area { margin-bottom: 0px; text-align: center; width: 2000px; // <-- Remove this! } Then set your image dimensions to your taste. It will flow with the container.
I did everything mentioned above, but I'm still left with the black region. lol am I really just this much of an idiot or is there something I'm missing? I'm looking to achieve this result.
Hey man I'll help you out-send me a copy of your source files and I'll do it for you with an analysis of what to do.