Skip to Main Content

Java EE (Java Enterprise Edition) General Discussion

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

Want to Stop Text Wrap Around Problem in Table Cells

843844Jul 11 2007 — edited Jul 12 2007
I display a table inside a <div> because I want to show scrollbars. However, I have wrapped around text inside table cells although I provide enough width to each column and used white-space:nowrap; overflow-x:scroll. How do I make all text in each table cell displayed in one single line?
...
<style>
.scrollbar
    {
        overflow-y:auto;
        overflow-x:scroll;
		scrollbar-face-color: #C0C0C0;
		scrollbar-arrow-color: #587090;
		scrollbar-track-color: #90A0B0;
		scrollbar-shadow-color: #7B7B7B;
		scrollbar-highlight-color: #F9F9F9;
		scrollbar-3dlight-color: #FFFFFF;
		scrollbar-darkshadow-Color: #8B8B8B; 
    }
.lovTableDefault
	{
		BORDER-TOP: #006699 1.5px solid;
		BORDER-LEFT: #006699 1.5px solid;  
		BORDER-RIGHT: white 1.5px solid; 
		BORDER-BOTTOM: white 1.5px solid;
		padding: 3px;
        overflow-y:auto;
        overflow-x:scroll;
		white-space: nowrap;
	}

.tableHeaderDefault
	{
		text-align: left;
		white-space: nowrap;
		FONT-SIZE: 0.7em; 
		FONT-FAMILY: Arial, Helvetica, sans-serif; 
	}

.codeColumn
	{
		text-align: left;
		FONT-FAMILY: Verdana, sans-serif; 
		font-size:0.7em;
		width: 7em;
		white-space: nowrap;
		border: 0;		
	}
		
.descriptionColumn
	{
		text-align: left;
		FONT-FAMILY: Verdana, sans-serif; 
		font-size:0.7em;
		width: 30em;
		white-space: nowrap;
		border: 0;	
	}
</style>
....
 						<div style="height:12em; width:20em;" id="container" class="scrollbar"> 
							<h:dataTable value="#{countriesManagementBean.countriesList}" var="country" 
									id="countryTable" styleClass="lovTableDefault"
									border="0" cellspacing="1" bgcolor="#FFFFFF" 
									headerClass="tableHeaderDefault" columnClasses="codeColumn, descriptionColumn" >
							 <h:column>
							   <f:facet name="header">
							     <h:outputText style="width:7em; white-space:nowrap;" value="Code"/>
							   </f:facet>
								<h:outputText value="#{country.code}"/>
							 </h:column>
							 <h:column>
							   <f:facet name="header">
							     <h:outputText style="width:30em; white-space:nowrap;" value="Description"/>
							   </f:facet>
							   <h:outputText value="#{country.description}"/>
							 </h:column>
							</h:dataTable>
						</div>
....
....
Comments
Locked Post
New comments cannot be posted to this locked post.
Post Details
Locked on Aug 9 2007
Added on Jul 11 2007
7 comments
155 views