• Hello.
    Firstly here is the blog that i am working on
    http://blog.betteroffdead.co.uk

    Im new to CSS coding but have made websites with HTML before so i thought id have ago, i have come upto three tiny problems though

    -firstly how can i remove the grey drop shadow effect from around my header?

    -secondly, why is my header image placed too far down? instead of centering?

    -thirdly, i really want to change the size of “Posted in Uncategorized | Edit | No Comments »” where do i need to look for these codes?

    If i need to post any codes for reference just say.

    Thank you in advance.!

Viewing 14 replies - 1 through 14 (of 14 total)
  • Thread Starter betteroffdead

    (@betteroffdead)

    excellent thank you whooami
    now just question 2 and 3 left
    cheers.!

    in the stylesheet, find this:

    #headerimg {
    	margin: 0;
    	height: 200px;
    	width: 100%;
    	}

    delete it.

    Thread Starter betteroffdead

    (@betteroffdead)

    for the headerimg i have this

    #headerimg 	{
    font size: 1.2em;
    	margin: 0 auto;
    text-align: center;
    width:85%;
    height: 6.5em;
    color: black;
    padding-top: 10px;
    padding-bottom: 10px;
    background: url("http://blog.betteroffdead.co.uk/wp-content/uploads/2009/01/betteroffdeadheader.gif")
      no-repeat bottom center;
    }

    look further down.

    #sidebar
    {
    	float: right;
    	width: 190px;
    	}
    
    #headerimg {
    	margin: 0;
    	height: 200px;
    	width: 100%;
    	}
    
    .narrowcolumn {
    	float: left;
    	padding: 0 0 20px 45px;
    	margin: 0px 0 0;
    	width: 450px;
    	}

    Since you have already renamed the theme, I’ll assume you can take it from here.

    Thread Starter betteroffdead

    (@betteroffdead)

    Also, if I click on anything in the sidebar ie archives: january
    the footer image seems to shrink drastically and position itself left!
    Anyone have any suggestions on this also?
    THANK YOU SO MUCH AGAIN!!!

    Thread Starter betteroffdead

    (@betteroffdead)

    Can anyone help me with this last problem?
    thank you!!!!
    the blog
    http://blog.betteroffdead.co.uk

    Try this…

    .postmetadata {
    font-size: 1.1em;
    clear: both;
    }

    Thread Starter betteroffdead

    (@betteroffdead)

    Nope, still no luck.
    Sorry!
    Any other ideas?

    ClaytonJames gave you the right answer but you need to make sure that there is no other .postmetadata { font-size: 0.8em; } further down in the file. Place the

    .postmetadata {
    font-size: 1.1em;
    clear: both;
    }

    on the last line of your style.css file and you’ll see it works.

    Thread Starter betteroffdead

    (@betteroffdead)

    It still doesnt seem to change anything, and when I do add the font-size it changes the font size under each post where it says “posted in…./no comments”
    have i maybe added a piece of code that is stopping this from working?

    Well yes, that what you were asked for when you wrote:

    -thirdly, i really want to change the size of “Posted in Uncategorized | Edit | No Comments »” where do i need to look for these codes?

    If you’re not looking for a way to change the font-size, what is it, you want to change? You may be as specific as you like 😉

    Thread Starter betteroffdead

    (@betteroffdead)

    Oh sugar, sorry. i thought i was refeering to a coding problem on another post i did
    the problem refers to the footer, when ever you access an archive page like “january 2009” it shrinks in size.
    Do you know any way of altering this?
    THANKS!!!

    That’s probably because you’re using a relative unit to specify the font size. 1em is like 100% of the defined font-size. 0.8em is like 80% of the font-size. When I style a <div> to have a 0.8em font-size and place another <div> inside it which I also style with 0.8em font-size your font-size will be 0.64em or 80% of 0.8em

    So look for font-sizes in the <div> ‘s that the .postmetadata <div> is in.

    Because CSS reads from the top down and from general to specific, it’s best start at the top with the container <div>‘s and tags like the <body> tag. and avoid being very specific on them. Then coding from general at the top to specific at the bottom. This will avoid long lists of selectors in your stylesheet. and make it easier to style specific elements.

    I’m personally not for having selectors listed twice in the same sheet. Some will split their stylesheet in 2 having the layout in the top half and styling at the bottom. You always end up being inconsistent and changing a value at the top and not seeing any change because another value at the bottom overrides it because it’s further down the page.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘3 problems requiring help!’ is closed to new replies.