HUGE gap between first post and the rest

  • Please take a look here:
    https://www.t-van.net/wordpress

    Do you see the first post? and then there is a huge white gap between it and the rest of the posts?

    I don’t understand what the problem is. Please take a look at my css:

    /* commented backslash hack v2 \*/
html, body {
	height:100%;
}
/* end hack */
html, body {
	margin: 0;
	padding: 0;
}
body {
	background: #566152;
	background-image: url(/wordpress/wp-content/themes/kathy/images/bg.png);
        color: #000;
	font-family: 'Arial', Verdana, sans-serif;
	font-size: 14px
}
#container {
	margin-left:auto;
	margin-right:auto;
	width: 900px;
	min-height:100%;
	background: url(/wordpress/wp-content/themes/kathy/images/divbg.png) repeat-y center;
	position:relative;
}
/* commented backslash hack v2 \*/
* html #container {
	height:100%;
}
* html #container {
	width:902px;
	w\idth:900px;
}

/* end hack */ 

#header {
	width:100%;
height:148px;
position:relative;
index-z:2;

}
* html #header {
	height:150px;
	he\ight:148px
}
.link {
	float:left;
	height: 59px;
}
* html .link {
	height:61px;
	he\ight:59px
}
#links {
	padding: 0;
	width:100%;

}
#sidebar {
	float: right;
	text-align: left;
        width: 178px;
	padding-right: 16px;
	position:relative;

}
#content {
	width: 659px;
	padding-left: 20px;
        text-align: left;
        font: 14px Arial;
}
#sidebar p, {
	margin:2px;
        text-align: left;
        font-family: arial, verdana;
        font-size: 11px
        letter-spacing: 0px;

}
#footerwrap {
	padding: 0 0;
	height:146px;
	position:relative;
	width: 900px;
	margin:-151px auto 0;
}
#footer {
	position:relative;
	width:100%;
}

* html #footerwrap {
	height:151px;
	he\ight:146px;
}
#clearfooter {
	height:146px;
	width:100%;
	clear:both
}

a: link {
	color: :#667b41;
}

a: img {
	border: none;
}

a:visited {
	color: #7a9050;
}

a:hover {
	color: #acc878 ;
}

h2 {/* title of posts */
	border-bottom: 1px dotted #97a96d;
	font: 17px "Times New Roman", Times, serif;
	letter-spacing: 0.1em;
	font-weight: bold;
	margin: 17px 0 2px 0;
	padding-bottom: 2px;
}

h3 {/* title of date */
	border-bottom: 1px dotted #eee;
	font-family: 12px "Times New Roman", Times, serif;
	margin-top: 0;
}
h4 {/* Heading of something */
	font-family: 16px "Times New Roman", Times, serif;
	border-bottom: 1px dotted #566152;
        margin-top: 0;
}

ol#comments li p {
	font-size: 100%;
}

p, li, .feedback {
	font: 12px 'verdana', 'arial', times new roman, sans-serif;
	letter-spacing: 0px;
}

/* classes used by the_meta() */
ul.post-meta {
	list-style: none;
}

ul.post-meta span.post-meta-key {
	font-weight: italic;
}

.feedback {
	color: #98ae3a;
	text-align: right;
	clear: both;
}

.meta {
	font-size: 12px;
}

.meta li, ul.post-meta li {
	display: inline;
}

.meta ul {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

.meta, .meta a {
	color: #6d8519;
	font-weight: normal;
	letter-spacing: 0;
}

.storytitle {
	margin: 0;
}

blockquote {
	border-left: 5px solid #c7e17f;
	margin-left: 11px;
	padding-left: 5px;
}
cite {
	font-size: 90%;
	font-style: normal;
}
#commentform #author, #commentform #email, #commentform #url, #commentform textarea {
	background: #fff;
	border: 1px solid #333;
	padding: .2em;
}

#commentform textarea {
	width: 100%;
}

#commentlist li ul {
	border-left: 1px solid #6d8519;
	font-size: 12px;
	list-style-type: none;
}

/* images aligment */
.aligncenter,
div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

/* End captions & aligment */
Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter t_van

    (@t_van)

    I forgot to add that it looks fine in firefox, but in Internet Explorer, it doesn’t.

    Hi,

    A look at your source code shows that the 6-2-2009 post was cut and pasted from Microsoft Word. This adds a lot of invalid code that creates errors in your page appearance.

    A prior post, “Blog messed up in IE (Pasting from Word)” addresses this problem.

    Thread Starter t_van

    (@t_van)

    Thankyou, but that was not the problem.
    Even though I deleted that post, it still continues to persist.

    And actually, it does NOT look fine in Firefox at all.

    Try to remove the ‘read more’ and see if that fixes your problem. It seems like your ‘read more’ is what is interfering somehow.

    Thread Starter t_van

    (@t_van)

    yes, I removed the read more.
    and I don’t think that’s the problem. Because it still persists.

    Hi,

    At this point we return back to basics. A check of your site in the W3C HTML Validator reveals 48 errors, many of them ‘Opening and Ending Tag Mismatches’.

    If this was my site, I’d start from the top and work through the errors one-by-one. I still see lots of deprecated tags. Deprecated means tags not fully suppported by your DOCTYPE that may show display errors in some browsers. You should correct those to valid XHTML. <i> should be <em>, <b> should be <strong>, and so forth.

    On line 523, you entered a </br> tag instead of a self-closing <br /> tag. Interesting what fixing that would do.

    You certainly have good company! We all go through this, certainly when a site-glitch is hidden and persistent. We can take another look when the errors are corrected…

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘HUGE gap between first post and the rest’ is closed to new replies.