How to control view column widths on the web

You Can View User Feedback To This Tip

I often need to control width of columns in web views. It is possible to create view treated as HTML and get almost full control on how it will look but you loose some advantages of Domino generated views (e.g. ability to present documents in categories).

The trick takes advantage of pass-thru HTML code. I placed my own <TH> tags in column titles and commented-out tags generated by Domino.

In this example I have documents with fields Name, City and Address and a view with 3 columns: City, Name and Address, categorized by 1st column. Widths of the columns are Name = 65%, Address = 35%.

First of all I remove all formatting tags by resetting font to "Default Sans Serif", 10pt and set color to black in all column titles

A title text for the first column is (without quotes):

"[</TH><!-- " 

I started pass-thru HTML code with left bracket, closed the first <TH> 
tag (generated by Domino) and commented-out next <TH> tag.

Second column's title (without quotes):

" --><TH WIDTH=65%>Name</TH><!-- " 

First I closed comment tag from previous title then added my own <TH>
 element and again commented-out following Domino-generated <TH> tag.

And the last column's title is (without quotes again):

" --><TH WIDTH=35%>]Address"

Here I closed previous comment again, added opening <TH> tag then closed
 pass-thru HTML with right bracket. The closing </TH> tag will be
 generated by Domino.

And here is how the source code looks in a web browser:

<TH NOWRAP ALIGN=left></TH><!-- </TH>
<TH NOWRAP ALIGN=left> --><TH WIDTH=65%>Name</TH><!-- </TH>
<TH NOWRAP ALIGN=left> --><TH WIDTH=35%>Address</TH>

As you can see there is no way how to add parameters to the fist column's tag.
In the case of categorized first column this is OK, but if you need to control
first column's <TH> tag too, you will need to add new empty column in
front of it.

I prefer to control formatting of pages by style sheets, but is also possible
to put additional HTML tags inside <TH> elements or add parameters like
NOWRAP or ALIGN to <TH> tag itself. For example the title for Name
column may looks like:

" --><TH NOWRAP WIDTH=65%><B><FONT COLOR=red>Name</FONT></B></TH><!-- "

The code is tested on Domino R5 server. 


  • This method uses the Designer IDE and not some PassThru or CSS feature to control the size of the column.

    In the View Design, change the column header to:
    MyLabel[<IMG SRC="/icons/ecblank.gif" BORDER=0 HEIGHT=1 WIDTH=100 >]
    Adjust "MyLabel" and/or WIDTH= —Michel Fecteau

This was first published in April 2001

There are Comments. Add yours.

TIP: Want to include a code block in your comment? Use <pre> or <code> tags around the desired text. Ex: <code>insert code</code>

REGISTER or login:

Forgot Password?
By submitting you agree to receive email from TechTarget and its partners. If you reside outside of the United States, you consent to having your personal data transferred to and processed in the United States. Privacy
Sort by: OldestNewest

Forgot Password?

No problem! Submit your e-mail address below. We'll send you an email containing your password.

Your password has been sent to:

Disclaimer: Our Tips Exchange is a forum for you to share technical advice and expertise with your peers and to learn from other enterprise IT professionals. TechTarget provides the infrastructure to facilitate this sharing of information. However, we cannot guarantee the accuracy or validity of the material submitted. You agree that your use of the Ask The Expert services and your reliance on any questions, answers, information or other materials received through this Web site is at your own risk.