Cape Fear Community College

  •  
  •  
  •  

Resolving Text Display Errors

My Text Looks Funky

You might notice that your text is not displaying as expected in your Blackboard courses. For instance, the text might all float to the left, taking up just a fraction of the page width, as shown below. This is not pretty.

If you do not see something similar to the text below, refer to the Resolving Invalid HTML Errors document for other issues.

text display problem

Why did this happen to me?

The reason for this error is usually due to copying and pasting bad code, often from Word or similar applications. I know, you've heard this reason before, but it's true. It is always preferable to type directly into the text editor in Blackboard since word processing programs generally have a lot of backend code that can be problematic.

In the case above, however, tags were incorrectly used for layout. Sometimes inappropriate code will land in your text editor, creating chaos on your page. It might display properly in some browsers, but not others. In the example shown on this page, tags for definition items were nested around large blocks of content, causing this strange display.

While the old version of Blackboard might have ignored such shenanigans, the new Blackboard attempts to provide clean and proper code (it's the right thing to do), so this becomes a problem.

How do I fix it?

The 100% proven method to eliminate text display problems is to type the content over, directly in the text editor in Blackboard. This will remove any unnecessary code that might have been carried over from copying and pasting.

If you are not interested in replacing the text, the first thing you should try is to resolve the issue by searching for and removing bad code (not as scary as it sounds).

  1. Select the dropdown arrow to reveal the menu for the problem item and choose the "Edit" link.
    dropdown menu link and edit menu item
  2. You must now enter HTML Source Mode for the item by selecting the icon illustrated below (see #1). It looks like a less than and greater than sign. The most common problems we are finding are issues with definition tags being included in the code. If you see code that looks like the areas in the red triangles (or any tags with <dl>,<dt>,<dd>, </dd>,</dt> or </dl>), delete them by highlighting them with your mouse and clicking the Delete key on your keyboard. You must remove both the opening tags (see #2 below) and the closing tags (#3). Closing tags include the forward slash.

    NOTE: Be careful not to remove other items.
    Enter Source Code mode
  3. Click the Submit button and recheck your content.

If the display is still wrong, you have further code issues that require professional intervention. However, remember that you can type in fresh text, which will produce a sparkling new item that is free from coding problems.