?

Log in

No account? Create an account

Previous Entry | Next Entry

First, this community is great. I've made some css changes (still many more to go) with the collective wisdom here. Thanks for that!

On my personal journal, I'm having trouble with the header text. I was able to put in my own header image, and I got it to move down so that I could get the navigation text in there somewhere--currently at the top. Is it possible to move the navigation text, journal title, and description to below the image? I tried using:
#header-text {margin-top: 200px;}
with that 200px being the height of my image, in the hopes that my text would then go under my image...but it just disappeared instead, I guess because the container wasn't tall enough(?).
I would be happy with putting this text either below or on my image.
Below, I'd like it left or center.
On, I'd like it right aligned.

Any ideas?

My info:
paid s2 user, sorbet lavendar
my added css:
*html .comment { height: 1%; }

#page, #content-inner, #header, #header-inner, #footer-inner { width: 92%; }

#header-inner {
background-position: center, top;
background-repeat: no-repeat;
background-image: url(http://img.photobucket.com/albums/v396/bluepoet/knithatbanner.jpg);
height: 250px;
width: 755px;
}

#header-text {margin-top: 0px;
}

#alpha, #alpha-inner, .asset-content { width: 72%; }

#beta { width: 20%; }
Any thoughts are appreciated! Thanks!

ETA: I've got a good fix on it for now. CSS for anyone interested:

*html .comment { height: 1%; }

#page, #content-inner, #header, #header-inner, #footer-inner { width: 800px; }

#page-inner {padding: 0px 0px 0px 0px; }

#header-inner {
background-position: center, top;
background-repeat: no-repeat;
background-image: url(http://img.photobucket.com/albums/v396/bluepoet/knithatbanner.jpg);
height: 200px;
width: 800px;
padding-top: 0px;
}

#header-photo { background-image: url(blank.gif); }
#header-photo-inner { background-image: url(blank.gif); }

#header-text {padding-top: 0px; }
#header-name { display:none; }
#header-description { display: none; }
#header-content-inner {
margin: 210px 15px 5px 458px;
}

#alpha, #alpha-inner, .asset-content { width: 80%; }

#beta { width: 20%; }

Comments

( 6 comments — Leave a comment )
chasethestars
Oct. 17th, 2006 06:17 pm (UTC)
try padding-top instead of margin-top
bluepoet
Oct. 17th, 2006 07:36 pm (UTC)
Thanks. Didn't seem to make a difference, but I just went ahead and got ride of the journal title and description for now to make enough room.
chasethestars
Oct. 17th, 2006 08:16 pm (UTC)
try this:

1. remove the padding/margin-top customizations

2. add this, which should get the text on top of your image:

#header-content-inner {
margin: 57px 15px 5px 20px;
padding-bottom: 106px;

}

Change the #s to what will work for you. In the example, here's what each number does:
57px in margin is the height of your text (I think)
15px is the right margin
5px is bottom margin
20px is the left margin

padding-bottom is the space you want from the bottom of the text area to the bottom of the #header-inner (the image)
bluepoet
Oct. 19th, 2006 05:39 pm (UTC)
Awesome. Thanks so much! I've got a good fix for now. :)

I'm going to ETA this and post my current css.
pollyannie
Oct. 21st, 2006 12:08 pm (UTC)
hi there..may i know how you can show a link on the outside such as changing the (read more..) words to (show me) something like dat? the bracket is a link
bluepoet
Oct. 23rd, 2006 02:31 pm (UTC)
It's an lj cut. See this in the FAQ.
( 6 comments — Leave a comment )

Latest Month

March 2016
S M T W T F S
  12345
6789101112
13141516171819
20212223242526
2728293031  

S2 Help Communities

Tags

Powered by LiveJournal.com
Designed by chasethestars