blank space above content

For questions and problems with the CMS core. This board is NOT for any 3rd party modules, addons, PHP scripts or anything NOT distributed with the CMS made simple package itself.
Post Reply
lleighh
Forum Members
Forum Members
Posts: 59
Joined: Tue Apr 11, 2006 2:40 pm

blank space above content

Post by lleighh »

Ok, I know this issue has been raised before but that fix didn't work for me.  So here's one of the pages my client has trouble with ... http://newdaypublishing.net/dev/index.php?page=positive-parenting (she sees a lot of white space before she's able to read the article. I see it fine, btw).

Here's my template:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<!-- Type the title of your site here -->
<title>New Day Publishing - {title}</title>

{metadata}
{stylesheet}

{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}

{literal}
<__script__ type="text/JavaScript">
<!--
//pass min and max -measured against window width
function P7_MinMaxW(a,b){
	var nw="auto",w=document.documentElement.clientWidth;
	if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</__script>
<!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}
<!-- The min and max page width for Internet Explorer is set here. For other browsers it's in the stylesheet "Layout: Top menu + 2 columns" -->



</head>

</__body>

<div id="wrap">

    <!-- start accessibility skip links -->
    <ul class="accessibility">
      <li><a href="#menu_vert" accesskey="s" title="Skip to navigation">Skip to navigation</a></li>
      <li><a href="#main">Skip to content</a></li>
    </ul>
    <!-- end accessibility skip links -->
 
<img id="frontphoto" src="uploads/andreas01/front4.jpg" width="757" height="155" alt="" />

      <!-- Start Horizontal Navigation -->
      <div id="avmenu">
         <h2 class="accessibility">Menu:</h2>
 
{cms_module module='menumanager' template='andreas01 : andreasmenu' number_of_levels="2" collapse="1"}    


      </div>
      <!-- End Horizontal Navigation -->

	  
   <!-- Start Breadcrumbs -->
<!--
Breadcrumbs is hidden for now
   <div class="breadcrumbs">
        {breadcrumbs starttext='You are here' root='Home' delimiter='»'}
   </div>
-->
   <!-- End Breadcrumbs -->

<div id="extras">
{global_content name='search'}
{global_content name='music'}
{global_content name='order'}

{global_content name='register'}

{global_content name='login'}

<p>
{global_content name='quotes'}</p>

</div>

   <!-- Start Content (Navigation and Content columns) -->
   <div id="content" class="clearfix">

      <!-- Start Content Area -->
      <div id="main">
         <h2>{title}</h2>
         {content} <br />

         <!-- Start relational links -->
<!-- hidden
	 <div class="hr"></div>
	 <div class="right49">
	 	<p><a href="#main">^ Top</a></p>
	 </div>
         <div class="left49">
            <p>{cms_selflink dir="previous"} <br />
            {cms_selflink dir="next"}</p>
         </div>
-->
	 <!-- End relational links -->

 
      </div>
	  <!-- End Content Area -->


   </div>
   <!-- End Content -->


   <!-- Start Footer -->
   <div id="footer" class="clearfix">
Copyright © 2007 New Day Publishing, LLC. Original Design by <a href="http://andreasviklund.com">Andreas Viklund</a>  |  Custom Design by <a href="http://www.llhargrove.com" target="_blank">Linda Hargrove</a>.
   </div>
   <!-- End Footer -->


</div><!-- end wrap -->


<__body>
</__html>


Here's my stylesheet:

Code: Select all

/* andreas01 - an open source xhtml/css website layout by Andreas Viklund (http://andreasviklund.com). Made for OSWD.org, free to use as-is for any purpose as long as the proper credits are given for the original design work. For design assistance and support, contact me through my website or through http://oswd.org/email.phtml?user=Andreas

Version: 1.0
(July 25, 2005)

Screen layout: */

/*
This layout depends on modified news summary template

<!-- Start News Display Template -->
{foreach from=$items item=entry}

<h3>
	{$entry->titlelink}
</h3>

<p>
{$entry->category}
{if $entry->author}
	by {$entry->author}
{/if}

{if $entry->formatpostdate}
<strong>
		{$entry->formatpostdate}
</strong><br />
{/if}


{if $entry->summary}
 {eval var=$entry->summary}
</p>
  <p class="textright">[{$entry->morelink}]</p>

{else if $entry->content}
		{eval var=$entry->content}
</p>
{/if}

{/foreach}
<!-- End News Display Template -->

Copy paste this template to your news summary template and delete from here
*/

body {
margin: 0 auto;
padding: 0;
font: 76% Verdana,Tahoma,Arial,sans-serif;
background: #f4f4f4 url(uploads/andreas01/bg.gif) top center repeat-y;
}

#wrap {
background: #ffffff;
color: #303030;
margin: 0 auto;
width: 760px;
}

#header {
clear: both;
margin: 20px 0 0 0;
padding: 0;
height: 45px;
}

#header h1 {
width: 250px;
margin: 0 0 10px 0;
float: left;
}

#header p {
width: 500px;
float: right;
text-align: center;
color: #a0a0a0;
margin: 0 0 10px 0;
font-size: 0.8em;
line-height: 1.2em;
}

#frontphoto {
margin: 0 0 10px 0;
border: 0;
}

#avmenu {
clear: left;
float: left;
width: 150px;
margin: 0 0 10px 0;
padding: 0;
font-size: 0.9em;
}

#avmenu ul {	
list-style: none;
width: 150px;
margin: 0 0 20px 0;
padding: 0;
font-size: 0.9em;
}	

#avmenu li {
margin-bottom: 4px;
}


/* first level */
#avmenu li a {
font-weight: bold;
height: 22px;
text-decoration: none;
color: #505050;
display: block;
padding: 6px 0 0 10px;
background: #f4f4f4;
border-left: 4px solid #cccccc;
}	
	
#avmenu li a:hover {
background: #eaeaea;
color: #286ea0;
border-left: 4px solid #286ea0;
}

#avmenu li a.menuactive {
background: #eaeaea;
color: #286ea0;
border-left: 4px solid #286ea0;
}


/* second level */
#avmenu li li a {
font-weight: normal;
height: 20px;
text-decoration: none;
color: #505050;
display: block;
padding: 6px 0 0 24px;
background: #FFF3BE;
border:0;
}	

#avmenu li li a:hover {
background: #eaeaea;
color: #286ea0;
border:0;
}

#avmenu li li a.menuactive {
background: #eaeaea;
color: #286ea0;
border:0;
}

/* third level */
#avmenu li li li a {
font-weight: normal;
height: 20px;
text-decoration: none;
color: #505050;
display: block;
padding: 6px 0 0 34px;
background: #f4f4f4;
border:0;
}	

#avmenu li li li a:hover {
background: #eaeaea;
color: #286ea0;
border:0;
}

#avmenu li li li a.menuactive {
background: #eaeaea;
color: #286ea0;
border:0;
}



.announce {
margin: 10px 0 10px 0;
padding: 10px;
width: 130px;
color: #505050;
background-color: #f4f4f4;
line-height: 1.3em;
}

#extras {
float: right;
width: 100px;
margin: 0 0 10px 0;
padding: 0;
font-size: 0.9em;
line-height: 1.5em;
}

#extras p {
margin: 0 0 1.5em 0;
}

#content {
margin: 0 110px 20px 160px;
border-left: 1px solid #f0f0f0;
border-right: 1px solid #f0f0f0;
padding: 0 10px 0 10px;
line-height: 1.6em;
text-align: left;
}

#content h2 {
font-size: 1.5em;
margin: 0 0 0.5em 0;
}

#content img {
padding: 1px;
background: #cccccc;
border: 4px solid #f0f0f0;
}

h3 {
font-size: 1.3em;
margin: 0 0 10px 0;
}

a {
text-decoration: none;
color: #286ea0;
}

a:hover {
text-decoration: underline;
color: #286ea0;
}

a img {
border: 0;
}

#footer {
clear: both;
margin: 0 auto;
padding: 10px 0 20px 0;
border-top: 4px solid #f0f0f0;
width: 760px;
text-align: center;
color: #808080;
font-size: 0.9em;
}

#footer a {
color: #808080;
text-decoration: none;
}

#footer a:hover {
text-decoration: underline;
}

.left {
margin: 10px 10px 5px 0;
float: left;
}

.right {
margin: 10px 0 5px 10px;
float: right;
}

.textright {
text-align: right;
}

.center {
text-align: center;
}

.small {
font-size: 0.8em;
}

.bold {
font-weight: bold;
}

.hide {
display: none;
}
User avatar
chead
Forum Members
Forum Members
Posts: 63
Joined: Tue Feb 06, 2007 4:01 am

Re: blank space above content

Post by chead »

Looks like the box model problem.

Firefox and IE calculate margins and padding differently, and this shows up most commonly when you use both horizontal padding and margins on elements, as on your #content div. IE thinks it doesn't have enough space, so it puts the content below your right-hand sidebar.

Try explicitly setting the width in px on your #content div; that might be all you need to do.
Post Reply

Return to “CMSMS Core”