Hello,

I have two almost identical scroll boxes where everything is working fine except for the horizontal scroll bar in the first box. The horizontal bar should not be showing at all but it does in the first box only.

The problem is not with the coding because I can switch boxes and it is always the first box only that is the problem regardless of what is presented in it.

I think it is probably a small </div> error or general formatting error that I am not seeing because I am new to coding. You can assume the PHP and Includes are correct.

You can see the problem at: http://www.usernomics.com/ergonomic-...essories5.html . My CSS and HTML are below if that's more convenient.

Can someone see what mistake I am making?

Thanks a lot,

Bob

 div.scroll { 
 height: 175px; 
 width: 145px; 
 overflow: auto; 
 text-align: left; 
 border: 2px solid #999; 
 background-color: #ccc; 
 padding: 0 0px 0px 0; 
 margin: 0px auto 0px auto;    
 }
 
 .centerall{                           
 	text-align:center;
 	font-size: 120%;
 	font-weight: bold;
  	padding: 0px 0px 0px 0px;
 	margin: 20px auto 5px auto;
 	float: center;
 	}
 
 
 .centermedium{                            
 	text-align:center;
 	font-size: 85%;
 	font-weight: normal;
 	padding: 5px 0px 5px 0px
 	}
 
 __
 
 <!-- RSS Feed Reader Usability In The News -->
 <?php unset($arnews);?>
 <div class="centerall"><a href="http://www.usernomics.com/news/user-interface-design-news.html" title="Usernomics In The News">Usability In The News</a></div>
 <div class="centermedium">Latest Headlines	
 </div>
 
 <div class="scroll">
 <?php
 include ("http://www.rssfeedreader.com/rss3/rss.php?url=http%3A%2F%2Fwww.usernomics.com%2Fnews%2Fuser-interface-design-news.xml&newpage=&chead=&atl=&desc=1&auth=&dts=&width=128&max=20&tlen=0&rnd=&bt=&bs=None&nmb=1&ntb=1&naf=1&nst=1&nwd=0&nht=0&dlen=100&bg=%23FFFFFF&bc=&tc=BLACK&ts=8&tfont=Verdana,+Arial,+Sans-serif&rf=".$HTTP_SERVER_VARS['SERVER_NAME'].$HTTP_SERVER_VARS['PHP_SELF']."&phpout=1");
 ?> 
 </div>
 
 <div class="centermedium"><a href="http://feeds.feedburner.com/NewsErgonomicsUserInterfaceDesignComputerHumanInteractionhci" title="Usability News Feed"><img src="images/site/rss.gif" alt="Usability In The News RSS Feed"></a></div>
 
 <!-- /RSS Feed Reader Usability In The News -->
 
 
 
 <!-- /RSS Feed Reader Ergonomics In The News -->
 <?php unset($arnews);?>
 <div class="centerall"><a href="http://www.usernomics.com/news/workplace-ergonomics-news.html" title="Ergonomics In The News">Ergonomics In The News</a></div>
 <div class="centermedium">Latest Headlines
 </div>
 
 <div class="scroll">
 <?php
 include ("http://www.rssfeedreader.com/rss3/rss.php?url=http%3A%2F%2Fwww.usernomics.com%2Fnews%2Fworkplace-ergonomics-news.xml&newpage=&chead=&atl=&desc=1&auth=&dts=&width=128&max=20&tlen=0&rnd=&bt=&bs=None&nmb=1&ntb=1&naf=1&nst=1&nwd=0&nht=0&dlen=100&bg=%23FFFFFF&bc=&tc=BLACK&ts=8&tfont=Verdana,+Arial,+Sans-serif&rf=".$HTTP_SERVER_VARS['SERVER_NAME'].$HTTP_SERVER_VARS['PHP_SELF']."&phpout=1");
 ?>  
 </div>
 
 <div class="centermedium"><a href="http://feeds.feedburner.com/UsernomicsWorkplaceErgonomicsSafetyBiometrics" title="Ergonomics News Feed"><img src="images/site/rss.gif" alt="Ergonomics In The News RSS Feed"></a>
 </div>
  </div>
 <!-- /RSS Feed Reader Ergonomics In The News -->

This may be a bit too obvious but I think it might just be right. The content of the first box is too long and is forcing the horizontal scrollbar to be there. The link "HierarchyVersusFacetsVersusTags" is the one that is making the box so wide.

you could use overflow-x and overflow-y properties to show vertical scroll and hide horizontal one, but thay are not standart and I'm not sure if they work in anything but IE.

Hey Shoot98,

You hit it right on the head. I went to the source and put spaces between the words and it worked.

Thanks so much for catching that. It was driving me crazy.

Bob