HELP! Vostok header CSS
-
Hello.
I`ve had my blog for a time now, but today is first time on the Forum.
Please, I need some serious help with the header of Vostok after I upgraded to CSS.
All I want to do is make the body wider (around 800) so that I can post a little larger images.See here how far (short) I`ve come: http://seungkyelee.wordpress.com/
This is what I need help with:
1. get rid of that old default header image box.
2. how do I make the header image (panorama bw) as wide as the body without disturbing the main menu area?It looks like a mess right now and I would REALLY appreciate some assistance as soon as possible!
Anyone?
Best regards
Seung KyeThe blog I need help with is: (visible only to logged in users)
-
This will give you 800px clear in the post area for your images.
#wrapper, #access, #main {width:870px; } #header {background:url("http://seungkyelee.files.wordpress.com/2010/11/fine-art-landscape-photography-blog-header-copyright-c2a9-seung-kye-lee-www-leeseungkye6.jpg") no-repeat scroll left bottom transparent; } #content .hentry, #entry-author-info {width:800px; }You need to create a new header image to replace the one you have with a width of 870px.
Also, in the “Limit width to” field right above the save stylesheet box, you want to enter 800.
-
I forgot to mention something. At wordpress.COM, never paste the entire stylesheet into the CSS edit box. Only put in there the specific selectors you need, and the specific declarations and then make sure that “add to existing…” is selected before saving your changes. Your changes will then override the like declarations in the original stylesheet. Pasting the entire stylesheet can and will cause issues.
-
Thank you so much, Sacredpath!!
Where do I put this code?
Yes, I have only “added to existing” and then made some changes to that stylesheet.
-
Copy everything you have currrently in the CSS edit window out and into a plain text file for reference and safe keeping.
Clear everything out of the CSS edit window and paste in what I have above and then take a look at things.
-
I`m lost..
1. Still haven`t figured out why the old default Vostok header “box”
still appears over my new header image.2. My new image disturbs (is on top of) the main menu.
I`ve tried to systematically remove, add and change the selectors
at those places I might think they should be changed, without success.
For those who know the answer it might be a piece of cake…
but, I`m totally lost now.Hope you, Sacredpath, or anyone can help me out here.
-
I will note that the primary and secondary sidebars for the bottom should probably be adjusted for width as well and I would suggest adding this as well.
#primary, #secondary {width:45%; } -
You will have to create a new header image that is 870px wide instead of the 770px it is now and then upload that image to your image library, get the URL of that image, and then replace the image URL in the #header section and it will then be full width of the blog. Once you start messing with the CSS, you can no longer use the custom header uploader. You have to do things directly in the CSS.
The adjustments I made give you 800px clear in the post area and made it so that other elements will not mess with things.
-
It`s done, Sacredpath!
Let me correct an error in my latest comment:
“PS:
Just earlier, I found that changing:
#content .hentry, #entry-author-info {width:800px; }
to: {width:870px; }
aligned the new header image by the way” – I meant: {width:730px; }I don`t know about you, but my nr. 1 and 2 problems are still visible.
What do you think? -
1. What header image box?
2. I covered that above. https://en.forums.wordpress.com/topic/help-vostok-header-css?replies=11#post-524199 -
I`m so sorry for messing things up, Sacedpath!
I`ve now done just as you told me; using the URL of a 870×126 as header image and cleared everything else than the codes you gave me. It looks good, but why is problem 1 and 2 still present?
– Tell me, don`t you see the empty box where the default header image used to be?
I do. -
1. What header image box?
2. I see a full width header now. Try clearing your browser cache and look again.If you want the blog title and tag line above the header image, I can do that. By default it is contained within the header image area.
-
Eureka!
The old box is now gone, by going into the Theme Options and uncheck the “Yes, show the header image”.Now as the old header area is taken care of, I do have one more question;
– how can I put the header image between blog title (Fine Art Landscape of SKL) and the menu?
I would love to do that.
I think the header image is obscuring both the title and menu as it is now.Thank you so very very much for your help, Sacredpath!!
-
-
You can really do this for me?
Man, I would have been lost without your help, my friend!
Been trying all kinds of things to have a blog that goes well
with my website to no avail.
As you know (by now), I`m not versed in CSS and could not have done this alone.
Tonight, because of you, things have changed!This is awesome, Sacredpath!
-
This is surely a piece of cake for you, but I am jumping to my roof right now!
That`s exactly what I wanted!Before I finish this up, would it be too much to ask if you know how to make
all (and only) the yellow text (post titles and links with URL`s) to another color?
All I need is the general section.
Then I will try to find a good color in a color chart later on.Please, bear with me, Sacredpath :-)
Thank you!
-
The will change everything but the blog title.
#content a:link, #content a:visited {color:#FF9900; }
- The topic ‘HELP! Vostok header CSS’ is closed to new replies.
WordPress.com Forums 