Help - Search - Members - Calendar
Full Version: gap between header and blog
Forums > Resource Center > Support Center > Livejournal Support > Livejournal Resolved Topics
squeex3
my layout has a gap between the header and blog like so.
how can i fix it so there is no huge gap between them?
i'm using firefox so that may be the reason. =/

just incase, here's the css:

CODE
FRIENDS_OPT_ITEMS=>10

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
}
-->
</style>
<tr><td colspan="0" width="100%">
<table align="left" cellspacing="0" border="0" cellpadding="0">
<tr><td><p align=left><font color=DD4644>Journal</font>:  <a href=http://www.livejournal.com/users/innocencex3/info>info</a> <a href=http://www.livejournal.com/users/innocencex3>recent</a> <a href=http://innocencex3.livejournal.com/friends>friends</a> <a href=http://www.livejournal.com/allpics.bml?user=innocencex3>icons</a>
<Br><font color=DD4644>Other</font>:  <a href=http://www.livejournal.com/update.bml?usejournal=innocencex3>update</a>
<br><Br><font color=DD4644>layout © <a href=http://www.livejournal.com/users/gaffe><font color=DD4644>gaffe</a>.
</td></tr></table></td></tr>
<=FRIENDS_WEBSITE

DAY_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments">
%%readlink%%<a href="%%urlpost%%">COMMENT</a>
</td>
</tr>
<=DAY_TALK_LINKS

LASTN_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments">
%%readlink%%<a href="%%urlpost%%">COMMENT</a>
</td>
</tr>
<=LASTN_TALK_LINKS

GLOBAL_HEAD<=

<style type="text/css">
tt, pre {
font-family: Tahoma;
}
.shadowed {
font-size: 7pt;
background: #FFF;
text-align:left;
line-height: 10px;
}

.shadowed img{
visibility:hidden;position:absolute;top:0
}


.shadowed td div{
visibility: hidden;
position: absolute;
top: 1px
}


.meta {
font-size: 7pt;
text-align:left;
line-height: 10px;
}
.index {
font-size: 7pt;
color: #333333;
text-align: right;
line-height: 10px;
font-weight: normal;
background: #FFFFFF;
text-decoration: none;
    border-bottom: 0px solid #cccccc;
    border-left: 0px solid #FFFFFF;
    border-top: 0px solid #000000;
    border-right: 0px solid #EAD3BD;
}



tr.caption{
display:none
}


.caption {
font-size:8pt;
font-weight: bold;
color: #333333;
line-height: 10px;
background: #FFFFFF;
text-decoration: none;
    border-bottom: 0px solid #cccccc;
    border-left: 0px solid #FFFFFF;
    border-top: 0px solid #000000;
    border-right: 0px solid #EAD3BD;
}


.comments {
font-size: 7pt;
text-align: right;
line-height: 10px;
font-color:hotpink
}
</style>


<style type="text/css">
body {
background-color: DDDDDD;
background-image: url(http://img455.imageshack.us/img455/6900/countdownft7vk9.png);
background-repeat: no-repeat;
background-position: center 10px;

font-family: tahoma;
font-size: 7pt;
line-height: 20px;
margin-top: 396px;
margin-right: 0px;
margin-left: 0px;}



a:link, a:active, a:visited {
color: #c0c0c0;
text-decoration: NONE;
cursor: auto;
font-weight: normal;
}

a:hover {
color:#808080;
text-decoration: none;
background:FFF;
cursor: auto;
font-weight: font-weight: normal;
}


td {
font-family: tahoma;
font-size: 7pt;
line-height: 10px;
text-align: justify;
letter-spacing: 0pt;
background: #ffffff;
cursor: default;
}

b {
font-weight:bold;
color:black
cursor: default;
}

font {
font-weight: normal;
font-family: tahoma;
font-size: 7pt;
line-height: 10px;
letter-spacing: 0pt;

/* currents (mood, music) and bottom banner navigation links */
table table table td.meta {
font-size: 7pt;
font-family: "tahoma", sans-serif;
color: #555555;
text-transform: lowercase;
background: #FFFFFF;
border-bottom: 5px #FFFFFF solid;
}
/* replacing default user icons */
span.ljuser{
background-image: url(YOURUPLOADEDUSER);
background-repeat: no-repeat;
background-position: left middle;
title: user;
}
span.ljuser img{
visibility: hidden;
}


/* display of date and time */
p .index {
font-size: 7pt;
color: #DDD;
font-family: "tahoma", sans-serif;
text-transform: uppercase;
text-align: right;
border-top: 1px #F0F0F0 dotted;
}


</style>


<style type="text/css">
table { width: 500; border: 0px solid #ffffff; background:#ffffff; align:center}
table table { width:100%; margin:0; border:0px none; background:#ffffff}
table table table { width:0; border: 0px none; background:#ffffff; padding: 1px}
table table table table {width: 100%; border: 0px none;}
</style>

<title>&; light up this room</title>
<=GLOBAL_HEAD

FRIENDS_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments">
%%readlink%%<a href="%%urlpost%%">???</a>
</td>
</tr>
<=FRIENDS_TALK_LINKS

LASTN_OPT_ITEMS=>10

LASTN_TALK_READLINK=> <a href="%%urlread%%">READ</a> <b><font color=DDD>%%messagecount%%</font></b>  

FRIENDS_TALK_READLINK=> <a href="%%urlread%%">READ</a> <b><font color=DDD>%%messagecount%%</font></b>

CALENDAR_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}
-->
</style>
<tr><td colspan="0" width="100%">
<table align="left" cellspacing="0" border="0" cellpadding="0">
<tr><td><p align=left><font color=DD4644>Journal</font>:  <a href=http://www.livejournal.com/users/innocencex3/profile>info</a> <a href=http://www.livejournal.com/users/innocencex3>recent</a> <a href=http://innocencex3.livejournal.com/friends/>friends</a> <a href=http://www.livejournal.com/allpics.bml?user=innocencex3>pictures</a>
<Br><font color=DD4644>Other</font>:  <a href=http://www.livejournal.com/update.bml?usejournal=innocencex3>update</a> <a href=http://www.livejournal.com/manage/>control</a>
<br><Br><font color=DD4644>layout © <a href=http://www.livejournal.com/users/gaffe><font color=DD4644>gaffe</a>.
</td></tr></table></td></tr>
<=CALENDAR_WEBSITE

LASTN_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}
-->
</style>
<tr><td colspan="0" width="100%">
<table align="left" cellspacing="0" border="0" cellpadding="0">
<tr><td><p align=left><font color=DD4644>Journal</font>:  <a href=http://www.livejournal.com/users/innocencex3/info>info</a> <a href=http://www.livejournal.com/users/innocencex3>recent</a> <a href=http://innocencex3.livejournal.com/friends>friends</a> <a href=http://www.livejournal.com/allpics.bml?user=innocencex3>icons</a>
<Br><font color=DD4644>Other</font>:  <a href=http://www.livejournal.com/update.bml?usejournal=innocencex3>update</a>
<br><Br><font color=DD4644>layout © <a href=http://www.livejournal.com/users/gaffe><font color=DD4644>gaffe</a>.
</td></tr></table></td></tr>
<=LASTN_WEBSITE

DAY_TALK_READLINK=> <a href="%%urlread%%">READ</a> <b><font color=DDD>%%messagecount%%</font></b>
Mulder
find this in your code:
CODE
<style type="text/css">
body {
background-color: DDDDDD;
background-image: url(http://img455.imageshack.us/img455/6900/countdownft7vk9.png);
background-repeat: no-repeat;
background-position: center 10px;

font-family: tahoma;
font-size: 7pt;
line-height: 20px;
margin-top: 396px;
margin-right: 0px;
margin-left: 0px;}


you need to reduce the margin-top value to reduce the gap. I think it was just a typo seeing as your image is 376px in height.
squeex3
i've done that but the gap is still there. =/
Mulder
theres something strange with your coding...

try removing 10px from this:
CODE
background-position: center 10px;



your navigation bar might also being screwing things up, because normally all you would have to do is reduce the margin-top value under body
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.