I followed the rules and validated my HTML, it was ok!
I'm using the standard CSS for
EllNav H Only 1C and
Nav-Horizontal, this
Code: Select all
/* A CSS Framework by Mike Stenhouse of Content with Style, adapted to CMSMS by Daniel Westergren */
/* NAV */
* html div#menu_horiz {
/* hide ie/mac \*/
height: 23;
/* end hide */
}
div#menu_horiz {
background-color: #ECECEC;
width: 100%;
margin: 0;
text-align: center;
}
div#menu_horiz ul {
margin: 0;
padding: 0;
list-style: none;
border-bottom: 1px solid #C0C0C0;
border-left: 1px solid #C0C0C0;
}
div#menu_horiz li {
float: left;
display: inline;
list-style: none;
margin: 0 ;
border-right: 1px solid #C0C0C0;
}
div#menu_horiz li a {
border-right: none;
}
div#menu_horiz a,
div#menu_horiz a:link,
div#menu_horiz a:active,
div#menu_horiz a:visited {
display: block;
padding: 5px 10px;
/* hide from ie/mac \*/
display: block;
/* end hide */
text-decoration: none;
margin: 0;
color: #18507C;
background: #ECECEC;
}
div#menu_horiz li a:hover {
background-color: #A1FA52;
}
div#menu_horiz .activeparent {
display: inline-block;
/* hide from ie/mac \*/
display: block;
/* end hide */
background-color: #abb0b6;
}
div#menu_horiz .current a,
div#menu_horiz .current a:link,
div#menu_horiz .current a:active,
div#menu_horiz .current a:visited,
div#menu_horiz .current a:hover,
div#menu_horiz .activeparent a,
div#menu_horiz .activeparent a:link,
div#menu_horiz .activeparent a:active,
div#menu_horiz .activeparent a:visited,
div#menu_horiz .activeparent a:hover
{
background-color: #abb0b6;
}
/* END NAV */
div#menu_horiz li.active01 h3 {
display: inline-block;
padding: 5px 10px;
/* hide from ie/mac \*/
display: block;
/* end hide */
font-size: 1em;
line-height: 1em;
text-decoration: none;
margin: 0;
color: #18507C;
background-color: #abb0b6;
}
#menu_horiz li.active02 h3 {
display: block;
text-decoration: none;
padding: 5px 5px 5px 10px;
font-weight: normal;
color: #18507C;
margin: 0;
font-size: 1em;
background-color: #abb0b6;
}
#menu_horiz li.active03 h3
{
display: block;
padding: 3px 5px 3px 25px;
border-bottom: none;
font-size: 90%;
font-weight: bold;
color: #18507C;
margin: 0;
}
I have a space of 18 pixels that doesn't belong there. With only raw HTML it is not there, but when I'm including the needed stylesheets or just one the space appears.
The HTML with the CSS markup is this:
Code: Select all
<__html>
<HEAD>
<title>{title}</title>
{metadata}
{stylesheet}
</HEAD>
</__body bgcolor="#E6E6E6" topmargin="10">
<!--<div id="pagewrapper">
<div id="container">-->
<table width="780" height="174" cellspacing="0" cellpadding="0" align="center" valign="top">
<tr>
<td width="780" height="151" background="header.jpg" valign="top">Legeruimte</td></tr>
<tr>
<td width="780" height="23" bgcolor="#D2D2D2">
<!-- Start Horizontal Menu -->
<div id="menu_horiz">
<h2 class="accessibility">Navigation</h2>
<div id="wrapper">
{cms_module module='menumanager' template="ellnav-accessible.tpl" number_of_levels='1'}
</div>
</div>
<!-- End Horizontal Menu -->
</td></tr>
<table width="780" height="421" cellpadding="0" cellspacing="0" align="center" valign="top">
<tr>
<td width="245" height="421" background="013left.gif" valign="top"><div id="content" class="clearfix">
<br><br><br>
Leeg</td></div>
<td width="10" height="421" bgcolor="white" valign="top"><!--leeg--></td>
<td width="525" height="421" bgcolor="white" valign="top">
<!-- Start Content (Navigation and Content columns) -->
<div id="content" class="clearfix">
<!-- Start Content Area -->
<div id="main">
<h2>{title}</h2>
{content} <br />
</div>
<!-- End Content Area -->
</div>
<!-- End Content -->
</td>
</tr>
</table>
</table>
<__body>
</__html>
I have absolutely no idea why the space is there or what I can do to remove it.
Margin's are all at 0 (zero).
Please can somebody help me out on this?
Thanks.
)
