O'Reilly logo

DotNetNuke® Websites: Problem — Design — Solution by Tracy Wittenkeller

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

10.3. Content

Anyone can create a great-looking skin (well, not quite). But that doesn't guarantee great-looking content, or content that is as easily manageable as it should be. In fact, many DNN users find it difficult to get a handle on formatting their content without digging into HTML. But the good news is that a little out-of-the-box thinking can go a long way.

To illustrate what I mean, let's take a look at Figure 10-4.

Figure 10.4. Figure 10-4

As you can see, the skin in Figure 10-4 has a three-column format, but the columns do not have an equal width by virtue of text alone. However, you can use a sneaky little trick to get the columns to display with the same width and add a little polish to the content layout, as shown in Figure 10-5.

Figure 10.5. Figure 10-5

The trick is not obvious . . . and that's the sneaky part and the beauty of it. All I did was insert a 1 × 1 pixel transparent spacer.gif at the bottom of all three Text/HTML modules. In this case, I specified the width of the spacer.gif as 200 pixels. The 1 pixel height makes virtually no difference on the page, and the 200 pixel width is consistent in all three modules, thus making them the same width. The beginning code looks like this:

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In eu dolor. ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required