Recent Topics

1 May 16, 2007 00:35    

My b2evolution Version: 1.9.x

Hi All...
I am using nautica_2gl, but have uploaded my own image for the header.
I would like to lower the text of the blog name to relative to the bottom of the image.

I have tried to move it myself but the whole <div> moves down every time move it :-/

I have only very basic css knowledge. I am using dreamweaver so it shoudn't be this hard... I know it's something simple... but what???

I would also like to insert a link directly below the image that goes back to my main site, again when I tried to do this everything moves down heaps... not sure what I'm doing wrong here and would appreciate any help

T.I.A

2 May 16, 2007 00:59

In the style.css file you find on line 100:

#header h1 {
	margin: 0 200px;
	padding: 0;
	height: 185px;
	line-height: 0em;
	color: #ff0033;
	font-size: 130%;
}


Here you can change the margin settings. Make the zero a positive number to move the text downward. You can also change the 200. Larger moves to the right. Negative numbers are also possible.

Good luck

3 May 16, 2007 01:21

:( changing the margin moved the whole thing, bg image and all, but the text is still at the top

http://img.photobucket.com/albums/v352/SanityQuest/gap2.gif

I changed the padding-top, that has moved just the text, but it has made a gap at the bottom, the further I move the text, the larger the gap is...

http://img.photobucket.com/albums/v352/SanityQuest/gap1.jpg

I think I will just have to live with the gap at the bottom unless anyone has any other suggestions??

... thanks Afwas :)

4 May 16, 2007 08:28

I've had a good nights sleep and a jar of coffee in the morning, so I uploaded the skin to my testblog only to notice it's not behaving the way I expected. There seems to be some redundant code that makes it difficult to point to the correct header.
This is it. In line 114 of style.css you find:

#header h1 a {
    font-size: 200%;
    line-height: 2em;
    margin: 0px;
    padding: 0;
    color: #ff0033;
}


Add the last two lines do it looks like:

#header h1 a {
    font-size: 200%;
    line-height: 2em;
    margin: 0px;
    padding: 0;
    color: #ff0033;
    position: relative;
    top: 30px;
}


Once again: if the top value is larger, the message goes down. You can also add a line:

    left: 30 px;


that moves the text to the right. If you use a negative number, it will move in the other direction.
If you type the code, don't forget the ; at the end of the line.

Good luck


Form is loading...