Banner/header at the top of page, how do I lower the header down? |
Banner/header at the top of page, how do I lower the header down? |
Jan 14 2007, 07:12 PM
Post
#1
|
|
Senior Member Group: Member Posts: 47 Joined: Jan 2006 Member No: 357,515 |
My livejournal: http://yucor.livejournal.com/
Can someone help me bring my banner/headyu a little bit lower? I want it directly on top of that box in the middle. It didn't used to be all the way at the top. I don't know what happened. Here's my layout code: CODE GLOBAL_HEAD<=
<title>Gimme Some Skin</title> <style type="text/css"> <!-- .shadowed img{ display:none; } b { color: #6ecadb; } td { font-size: 7.5pt; font-family: "Tahoma", sans-serif; color: #a4a4a4; text-align: justify; background: #FFFFFF; } /* MOOD, MUSIC, BOTTOM NAVIGATION */ table table table td.meta { font-size: 7.5pt; font-family: "Arial", sans-serif; color: #AAAAAA; text-transform: normal; background: #FFFFFF; } /* BACKGROUND IMAGE AND COLOR FOR THE PAGE */ /* MARGIN-TOP SHOULD BE AT LEAST THE HEIGHT OF YOUR HEADER */ body { background-color:#e5e5e5; background-image:url(http://img50.imageshack.us/img50/6999/bgimage7jc.png); background-repeat:repeat; background-attachment:fixed; background-position:top left; text-align:center; margin:0; margin-top:300px; padding:0; } /*HEADER IMAGE WIDTH IS THE WIDTH OF THE HEADER, HEIGHT IS THE HEIGHT OF YOUR HEADER, MARGIN LEFT IS THE NEGATIVE HALF WIDTH OF YOUR HEADER */ #header{ background-image:url(http://img.photobucket.com/albums/1003/Jchris34232/itsgoingdown2.png) ; position:absolute; visibility:visible; top:0px; width:550px; left:50%; margin-left:-275px; height:300px; text-align:center; font-size:20pt; } p table table td.caption { font-family: "Arial Narrow", sans-serif; font-size: 10pt; color: #999999; text-transform: normal; text-align: left; font-weight: bold; } p { margin:0; padding:0; } .entrybox p{ margin: 1.2em 0; } .entrybox td.index, .index3{ display:none; } .index2{ width:100%; text-align:right; border-bottom:1px dotted; color:#999999; display:block; text-transform:uppercase; letter-spacing:1.5; font-size:8pt; color:#dddddd font-family: "Tahoma", sans-serif; } .comments{ text-align:center; padding-bottom:50px; } .comments a{ color:#6ecadb; } .comments a:visited{ color:#dddddd; } .comments a:hover{ color:#dddddd; text-decoration: none; border-bottom: 2pt solid #c5eef8; } .comments img{ border:0; } /* TOP NAVIGATION YOU MIGHT HAVE TO CHANGE THE LEFT VALUE TO CENTER THE NAVIGATION LINKS UNDER THE HEADER*/ .nav1, .nav2{ padding-top:2; padding-bottom:2; position:relative; left:-0pt; display:block; } .nav1{ background-color: #f4f4f4; text-transform:normal; center; word-spacing:16px; } /* DO NOT CHANGE ANYTHING HERE */ table table td.shadowed table{ width:100%; } table td, .entrybox .meta{ padding:0; } .entrybox td{ padding:5px 10px; } .nav2 a{ color:#6ecadb; } .nav2 a:active{ color:#6ecadb; } .nav2 a:visited{ color:#dddddd; } .nav2 a:hover{ color:#dddddd; } a { color: #6ecadb; text-decoration:none; } a:visited { color: #d6d6d6; } a:hover { color:#dddddd; text-decoration: none; border-bottom: 2pt solid #c5eef8; } /* SETS THE WIDTH AND BACKGROUND COLOR OF THE TABLE (CHOOSE THE SAME WIDTH AS YOUR HEADER) */ div { margin:0 auto; width:550px; background:#ffffff; } div div { background: none; width: auto; height: auto; padding: 0; } div table { width: 98%; } div table table { width: 100%; } div table table table { width: auto; } div table table table table { width: 100%; } --> </style> <=GLOBAL_HEAD FRIENDS_OPT_ITEMS=>20 FRIENDS_WEBSITE<= <style type="text/css"> <!-- table table table table .meta {visibility:hidden;position:absolute;top:1px;} table table table table table .meta {visibility:visible;position:relative;top:1px;} tr.caption{ display:none; } .shadowed td div{ visibility: hidden; position: absolute; top: 1px; } /*ALLOWS YOU TO PUT IMAGES IN THE NAVIGATION LINES*/ .shadowed span.nav1 img, .shadowed span.nav2 img{ display: inline; visibility: visible; position: relative; } --> </style> <!--DO NOT REMOVE THIS IF YOU WANT A HEADER--> <div id="header"> <!--HEADER IMAGE, if you want to write something on top of it, do it here --> </div> <!--This fixes a bug in Internet Explorer--> <div> </div> <!--END OF HEADER DIV--> <!--START OF NEW NAVIGATION--> <tr><td colspan="5" width="100%"> <table cellspacing="0" border="0" cellpadding="0"> <tr><td class="meta"> <!--FIRST ROW OF NEW NAVIGATION LINKS--> <center><span class="nav1"> <a href="http://www.livejournal.com/users/yucor/info">userinfo</a> <a href="http://www.livejournal.com/users/yucor">recent</a> <a href="http://www.livejournal.com/users/yucor/friends">friends</a> <a href="http://www.livejournal.com/friends/add.bml?user=yucor">add</a> <br /></span><br /> <!--END OF FIRST ROW OF NEW NAVIGATION LINKS--> <!--SECOND ROW OF NEW NAVIGATION LINKS--> <span class="nav2"> Xanga: <a href="http://www.xanga.com/royalriver">yourlink</a> » Wentworth Miller : <a href="http://wentworthmilleronline.com/">fansite</a> » J&B: <a href="http://www.jackieandbender.com/">KISS 106.1</a> </span></center> <!--END OF SECOND ROW OF NEW NAVIGATION LINKS--> <br /><br /> </td></tr></table></td></tr> <=FRIENDS_WEBSITE LASTN_TALK_READLINK<= <a href="%%urlread%%"><b>%%messagecount%%</b> <img src="http://img485.imageshack.us/img485/2118/read9oc.gif" alt="read" title="Read"></a> <=LASTN_TALK_READLINK LASTN_OPT_ITEMS=>10 LASTN_DATE_FORMAT<= </td></tr> <span class="index2">%%monlong%% %%dth%%, %%yyyy%% %%12h%%:%%min%% %%ampm%%</span> <tr><td class="index3"> <=LASTN_DATE_FORMAT LASTN_WEBSITE<= <style type="text/css"> <!-- /*HIDES THE ORIGINAL NAVIGATION*/ table table table table .meta {visibility:hidden;position:absolute;top:1px;} table table table table table .meta {visibility:visible;position:relative;top:1px;} tr.caption{ display:none; } .shadowed td div{ visibility: hidden; position: absolute; top: 1px; } .shadowed span.nav1 img, .shadowed span.nav2 img{ display: inline; visibility: visible; position: relative; } --> </style> <!--DO NOT REMOVE THIS IF YOU WANT A HEADER--> <div id="header"> <!--HEADER IMAGE, if you want to write something on top of it, do it here --> </div> <!--This fixes a bug in Internet Explorer--> <div> </div> <!--END OF HEADER DIV--> <!--START OF NEW NAVIGATION--> <tr><td colspan="5" width="100%"> <table cellspacing="0" border="0" cellpadding="0"> <tr><td class="meta"> <!--FIRST ROW OF NEW NAVIGATION LINKS--> <center><span class="nav1"> <a href="http://www.livejournal.com/users/yucor/info">userinfo</a> <a href="http://www.livejournal.com/users/yucor">recent</a> <a href="http://www.livejournal.com/users/yucor/friends">friends</a> <a href="http://www.livejournal.com/friends/add.bml?user=yucor">add</a> <br /></span><br /> <!--END OF FIRST ROW OF NEW NAVIGATION LINKS--> <!--SECOND ROW OF NEW NAVIGATION LINKS--> <span class="nav2"> <center>Xanga: <a href="http://www.xanga.com/royalriver">RoyalRiver</a> » Wentworth Miller : <a href="http://wentworthmilleronline.com/">fansite</a> » J&B: <a href="http://www.jackieandbender.com/">KISS 106.1</a> </span></center> <!--END OF SECOND ROW OF NEW NAVIGATION LINKS--> <br /><br /> </td></tr></table></td></tr> <=LASTN_WEBSITE LASTN_TALK_LINKS<= <tr><td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments"> %%readlink%% <a href="%%urlpost%%"><img src="http://img210.imageshack.us/img210/402/comment3wm.gif" alt="comment" title="Comment"></a> <a href=http://www.livejournal.com/tools/memadd.bml?%%itemargs%%><img src="http://img210.imageshack.us/img210/5619/mem0pc.gif" alt="add to memories" title="Add to memories"></a> <a href=http://www.livejournal.com/editjournal_do.bml?%%itemargs%%><img src="http://img485.imageshack.us/img485/6686/editpost7wu.gif" alt="edit post" title="Edit post"></a> </td> </tr> <=LASTN_TALK_LINKS |
|
|
*Azarel* |
Jan 14 2007, 07:44 PM
Post
#2
|
Guest |
I'm not entirely sure how much further down you want it, but a quick skim of your coding makes me think that you should adjust the red to move it up/down (I'm not entirely sure, though, let me know how it goes).
#header{ background-image:url(http://img.photobucket.com/albums/1003/Jchris34232/itsgoingdown2.png) ; position:absolute; visibility:visible; top:0px; width:550px; left:50%; margin-left:-275px; height:300px; text-align:center; font-size:20pt; } |
|
|
Jan 14 2007, 07:54 PM
Post
#3
|
|
i lost weight with Mulder! Group: Official Designer Posts: 4,070 Joined: Jan 2005 Member No: 79,019 |
body {
background-color:#e5e5e5; background-image:url(http://img50.imageshack.us/img50/6999/bgimage7jc.png); background-repeat:repeat; background-attachment:fixed; background-position:top left; text-align:center; margin:0; margin-top:300px; padding:0; } i think this is actually where you would edit it. 300px is the height of your header, and you should (i hope) just be able to increase it. try anna's first. she actually uses S1. |
|
|
Jan 14 2007, 08:24 PM
Post
#4
|
|
Senior Member Group: Member Posts: 47 Joined: Jan 2006 Member No: 357,515 |
Azarel: Your advice worked. Thanks to both of you guys for replying and helping me out.
I'm glad things worked out. Please PM me if you have any other questions and I'll reopen this thread for you. This post has been edited by Azarel: Jan 15 2007, 06:03 PM |
|
|