Page 1 of 1
Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 7:15 pm
by GSP
Hello,
I can't for the life of me figure out how to get rid of a vertical gray line within my bullet menu located to the right of the text. All that I want is to have an all white background which I almost have but this pesky gray line just won't go away.
Is there anyone who might have experienced the same problem or know of a quick fix for making the entire bullet menu space display with a white background.
This is my first post and I hate that this is my first question but I've been stuck on this for too long. Any help would be greatly appreciated.
Thanks,
Tom
Re: Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 7:17 pm
by Dr.CSS
Were here to help, but we will need a link or HTML and CSS to see...
Re: Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 8:23 pm
by palan
Where I've had similar problems, it's when I've copied and pasted a bulleted list into the cmsms wysiwyg text editor. Try removing the formatting and re-applying it within the editor. The pestky grey line has usually been on the left in my case though - and hasn't been on an active menu item.
Re: Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 8:27 pm
by GSP
Thank you Mark,
Here's a link to my test site:
http://www.memypetsandi.ca/cms
Tom
Re: Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 9:46 pm
by GSP
Sorry, you did ask for these too didn't you.
Code: Select all
body {
background-image:url(uploads/images/templates/horsegreen/body.gif);
color:#D1D1D1;
background-color:#ffffff;
font-size:13px;
font-family:arial;
}
a {
text-decoration:underline;
color:#666666;
background-color:#ffffff;
}
a:hover {
text-decoration:underline;
color:#ADBA5E;
background-color:#ffffff;
}
#main {
width:750px;
margin:auto;
background-color:#ffffff;
padding-bottom:10px;
}
#logo {
background-image:url(uploads/images/templates/horsegreen/logo.jpg);
background-position:left;
background-repeat:no-repeat;
margin-left:10px;
width:212px;
height:65px;
}
#layoutimage {
background-image:url(uploads/images/templates/horsegreen/horse_your-horse.jpg);
background-position:right;
background-repeat:no-repeat;
margin-left:10px;
width:493px;
height:241px;
}
.boxleft {
margin-left:10px;
}
#date {
float:right;
margin-right:20px;
font-size:12px;
color:#ffffff;
}
.tablenews {
width:209px;
background-position:right;
background-repeat:repeat-y;
color:#666666;
background-color:#ffffff;
}
.tablecontent {
width:483px;
align: center;
background-position:right;
background-repeat:repeat-y;
color:#666666;
background-color:#ffffff;
}
#menu {
width:189px;
margin-bottom:-5px;
margin-top:-5px;
color:#666666;
background-color:#ffffff;
}
#menu ul {
list-style-image:url(uploads/images/templates/horsegreen/bullet1.jpg);
padding-left:5px;
background: #FFFFFF;
}
#menu a {
text-decoration:bold;
color:#666666;
background-color:#ffffff;
}
#menu a:hover {
text-decoration:none;
color:#ADBA5E;
background-color:#ffffff;
}
#contentbox {
float:right;
width:493px;
}
#content {
background-position:left;
background-repeat:repeat-y;
margin-bottom:-20px;
margin-top:-22px;
padding-left:20px;
padding-right:20px;
color:#666666;
background-color:#ffffff;
font-size:12px;
font-family:arial;
}
#footer {
text-align:center;
margin-top:2px;
margin-bottom:2px;
font-size:11px;
color:#ffffff;
}
#footer a {
text-decoration:none;
color:#ffffff;
background-color:#ADBA5E;
}
#footer a:hover {
text-decoration:none;
color:#666666;
background-color:#ADBA5E;
}
#pagetitle {
text-align:left;
padding-left:10px;
width:455px;
font-size:15px;
color:#ADBA5E;
}
.bulletmenu {
width:212px;
background-color:#ffffff;
}
td.announcement{
background-color:#ECECEC;
color:#ff9900;
padding-left:5px;
font-size:13px;
font-family:arial;
}
.NewsSummary {
width:100%;
margin-top:5px;
background:#ffffff;
}
/********NEWS CSS******************/
.NewsSummaryCategory {
font-style: italic;
margin: 5px 0;
}
.NewsSummaryPostdate {
font-size: 90%;
font-weight: bold;
}
.NewsSummarySummary {
}
#NewsPostDetailDate {
font-size: 90%;
font-style: italic;
margin-bottom: 5px;
}
#NewsPostDetailSummary {
margin-bottom: 10px;
line-height: 150%;
}
#NewsPostDetailContent {
margin-bottom: 15px;
line-height: 150%;
}
#NewsPostDetailReturnLink {
margin-bottom:20px;
}
Code: Select all
<head>
<title>{title}</title>
{stylesheet}
{metadata}
</head>
</__body>
<table width="770" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><div align="left"><img src="uploads/images/templates/horsegreen/tlc.jpg" width="9" height="10" alt=""></div></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/top-bg.jpg" width="748" height="10"></div></td>
<td><div align="left"><img src="uploads/images/templates/horsegreen/trc.jpg" width="9" height="10" alt=""></div></td>
<td></td>
</tr>
<tr>
<td background="uploads/images/templates/horsegreen/bg-left.jpg"> </td>
<td colspan="2"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="8" bgcolor="#ffffff"></td>
</tr>
</table>
<table width="100%" border="0" cellpadding="6" cellspacing="0" bgcolor="#ADBA5E">
<tr>
<td align="right"><span id="date">{current_date format="%A %d-%b-%y %T "}</span></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="8" bgcolor="#ffffff"></td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td><div id="main">
<table width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<!-- TemplateBeginEditable name="Right" -->
<td width="209" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><div id="logo"></div> </td>
</tr>
<tr>
<td width="212" valign="top"><div class="boxleft">
<div id="menu">
<br /><br /> {bulletmenu collapse="1"}
</div>
</div></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><div class="boxleft"><table width="100%" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><table class="tablenews" cellspacing="0" cellpadding="0">
<tr>
<td><img src="uploads/images/templates/horsegreen/tlc1.jpg" width="5" height="5" alt=""></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/bg-top1.jpg" width="199" height="5"></div></td>
<td><img src="uploads/images/templates/horsegreen/trc1.jpg" width="5" height="5" alt=""></td>
</tr>
<tr>
<td background="uploads/images/templates/horsegreen/bg-left1.jpg"> </td>
<td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="4">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="5">
<tr>
<td height="22" class="announcement"><strong>Announcements</strong></td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td align="center" valign="top"><img src="uploads/images/templates/horsegreen/horse_1.jpg" width="173" height="69" alt=""></td>
</tr>
<tr>
<td>{cms_module module="news"}</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td background="uploads/images/templates/horsegreen/bg-right1.jpg"> </td>
</tr>
<tr>
<td><img src="uploads/images/templates/horsegreen/blc1.jpg" width="5" height="5" alt=""></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/bg-bott2.jpg" width="199" height="5"></div></td>
<td><img src="uploads/images/templates/horsegreen/brc1.jpg" width="5" height="5" alt=""></td>
</tr>
</table><br />
</td>
</tr>
</table></div></td>
</tr>
</table></td>
<!-- TemplateEndEditable --><td> </td>
<td width="530" valign="top"><!-- TemplateBeginEditable name="Body" --><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="2"><div id="layoutimage"></div></td>
</tr>
</table>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td><div align="left"></div></td>
<td valign="top"><div id="contentbox">
<div align="left"><img src="uploads/images/templates/horsegreen/top2.gif" height="20" width="483" alt="" /></div>
</table>
<div class="boxleft"><table class="tablecontent" cellspacing="0" cellpadding="0">
<tr>
<td><img src="uploads/images/templates/horsegreen/tlc1.jpg" width="5" height="5" alt=""></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/bg-top1.jpg" width="483" height="5"></div></td>
<td><img src="uploads/images/templates/horsegreen/trc1.jpg" width="5" height="5" alt=""></td>
</tr>
<tr>
<td background="uploads/images/templates/horsegreen/bg-left1.jpg"> </td>
<td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="4">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="5">
<tr>
<td height="22" bgcolor="#ECECEC"><div id="pagetitle"><strong>{breadcrumbs}</strong></div></td>
</tr>
<tr>
<td align="center" valign="top"><div id="content">
<div align="left"><br />{content}</div>
</div><br /></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td background="uploads/images/templates/horsegreen/bg-right1.jpg"> </td>
</tr>
<tr>
<td><img src="uploads/images/templates/horsegreen/blc1.jpg" width="5" height="5" alt=""></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/bg-bott2.jpg" width="483" height="5"></div></td>
<td><img src="uploads/images/templates/horsegreen/brc1.jpg" width="5" height="5" alt=""></td>
</tr>
</table></div>
<div align="left"><img src="uploads/images/templates/horsegreen/bottom2.gif" height="20" width="483" alt="" /></div>
<!-- TemplateEndEditable --></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#ADBA5E"><div id="footer">
Designed & Powered by:<br/>
<a href="http://www.mangomediahouse.com" target="_blank">Mango Media House</a></div></td>
</tr>
</table></td>
</tr>
</table>
</td>
</tr>
</table> </td>
<td> </td>
</tr>
<tr>
<td><div align="left"><img src="uploads/images/templates/horsegreen/blc.jpg" width="9" height="10" alt=""></div></td>
<td><div id="topbackground"><img src="uploads/images/templates/horsegreen/bg-bott.jpg" width="748" height="10"></div></td>
<td><div align="left"><img src="uploads/images/templates/horsegreen/brc.jpg" width="9" height="10" alt=""></div></td>
<td></td>
</tr>
</table>
<__body>
</__html>
Palan,
I don't believe I ever copied and pasted the bulleted list into the cmsms wysiwyg text editor.
Tom
Re: Pesky gray vertical line in bulletmenu
Posted: Sat Oct 27, 2007 11:57 pm
by Dr.CSS
You would be doing your self and disabled visitors a favor by using a non table layout...
The menu goes off to the left in Firefox...
The line in your CSS...
#menu {
width:183px;
background-image:url(uploads/images/templates/round/linie.gif);