Blocking Text Inside a DIV


Placing text inside a DIV provides an easy way of adjusting white space, backgrounds and other stylings. Here are some simple uses of a DIV. These examples are designed for the Run BASIC user with little or no experience in CSS design.

Note: The use of
HTML "</Div>"
at the beginning of each Run BASIC program and following each CLS statement allows Word Wrapping in non-Internet Explorer browsers.

A simple DIV for Blocking Text


' A simple demo displaying text in a CSSID designed DIV
' Text is a copy and paste from Wikipedia's discussion of Liberty BASIC
 
text$(1) = "Liberty BASIC was written by Carl Gundel and "+_
           "was published in its first release by his company, Shoptalk Systems in 1992, "+_
           "and has progressed steadily since then. "+_
           "The last published update to the software was in 2006. "+_
           "The current version is v4.03."
 
text$(2) = "Liberty BASIC has been used in examples of code for various guides and "+_
           "references about programming in Windows, "+_
           "including 'Beginning Programming For Dummies', by Wallace Wang."
 
text$(3) = "Though Liberty BASIC has its share of limitations in its design for "+_
           "advanced programming, it makes a credible and highly usable introductory IDE for "+_
           "moderate to advanced users of Windows and OS/2. "+_
           "DLLs are available with functions allowing users to overcome most of the limitations "+_
           "in Liberty BASIC. The OS/2 version is very old, but free. "+_
           "A new version that will run on Windows, Macintosh and Linux is in active development."
 
text$(4) = "The compiler recognizes its own dialect of the BASIC programming language."
 
text$(5) = "The programming language dialect, and the IDE have developed a market niche for "+_
           "introductory and intermediate programmers who are learning the skills of programming, "+_
           "though it has been less widely adopted as a commercial publishing product. "+_
           "This is not to say that Liberty Basic is educational software only. "+_
           "It is still a commercial product, and can be used to create proprietary software."
 
text$(6) = "In its current version, it runs only on Microsoft Windows, "+_
           "but v5 is in active development and runs on Mac OS X and Linux systems as well, "+_
           "in addition to being 'up to 5 times faster' than the current version, says its author."
 
Cls
HTML "</Div>"
Call setCSS
 
Div TextAreaStyle1
    For i = 1 to 6
       Print text$(i): Print
    Next i
End Div
Wait
 
Sub setCSS
    CSSID #TextAreaStyle1, "{
       Background-Color:#FFFFC0;
       Font-Family: Verdana;
       Font-Size: 12pt;
       Text-Align: Left;
       Color: Black;
       Width: 600px;
       Margin-Left: 100px;
       Border-Color: Blue;
       Border-Size: Thick;
       Border-Style: Ridge;
       }"
End Sub

Modified Version of Above To Include White Space

The CSS attribute Padding reserves margin space. Including a Print statement between paragraphs separates the text. White spacing makes the text easier to read.

' A simple demo displaying text in a CSSID designed DIV
' Text is a copy and paste from Wikipedia's discussion of Liberty BASIC
 
text$(1) = "Liberty BASIC was written by Carl Gundel and "+_
           "was published in its first release by his company, Shoptalk Systems in 1992, "+_
           "and has progressed steadily since then. "+_
           "The last published update to the software was in 2006. "+_
           "The current version is v4.03."
 
text$(2) = "Liberty BASIC has been used in examples of code for various guides and "+_
           "references about programming in Windows, "+_
           "including 'Beginning Programming For Dummies', by Wallace Wang."
 
text$(3) = "Though Liberty BASIC has its share of limitations in its design for "+_
           "advanced programming, it makes a credible and highly usable introductory IDE for "+_
           "moderate to advanced users of Windows and OS/2. "+_
           "DLLs are available with functions allowing users to overcome most of the limitations "+_
           "in Liberty BASIC. The OS/2 version is very old, but free. "+_
           "A new version that will run on Windows, Macintosh and Linux is in active development."
 
text$(4) = "The compiler recognizes its own dialect of the BASIC programming language."
 
text$(5) = "The programming language dialect, and the IDE have developed a market niche for "+_
           "introductory and intermediate programmers who are learning the skills of programming, "+_
           "though it has been less widely adopted as a commercial publishing product. "+_
           "This is not to say that Liberty Basic is educational software only. "+_
           "It is still a commercial product, and can be used to create proprietary software."
 
text$(6) = "In its current version, it runs only on Microsoft Windows, "+_
           "but v5 is in active development and runs on Mac OS X and Linux systems as well, "+_
           "in addition to being 'up to 5 times faster' than the current version, says its author."
 
Cls
HTML "</Div>"
Call setCSS
 
Div TextAreaStyle1
    For i = 1 to 6
       Print text$(i): Print
    Next i
End Div
Wait
 
Sub setCSS
    CSSID #TextAreaStyle1, "{
       Background-Color:#FFFFC0;
       Font-Family: Verdana;
       Font-Size: 12pt;
       Text-Align: Left;
       Color: Black;
       Width: 600px;
       Margin-Left: 25px;
       Border-Color: Blue;
       Border-Size: Thick;
       Border-Style: Ridge;
       Padding: 20px 20px 20px 50px;
       }"
End Sub

Same Demo as Above, But Using Overflow: Auto to Insert Vertical Scrollbar


' A simple demo displaying text in a CSSID designed DIV
' Text is a copy and paste from Wikipedia's discussion of Liberty BASIC
 
text$(1) = "Liberty BASIC was written by Carl Gundel and "+_
           "was published in its first release by his company, Shoptalk Systems in 1992, "+_
           "and has progressed steadily since then. "+_
           "The last published update to the software was in 2006. "+_
           "The current version is v4.03."
 
text$(2) = "Liberty BASIC has been used in examples of code for various guides and "+_
           "references about programming in Windows, "+_
           "including 'Beginning Programming For Dummies', by Wallace Wang."
 
text$(3) = "Though Liberty BASIC has its share of limitations in its design for "+_
           "advanced programming, it makes a credible and highly usable introductory IDE for "+_
           "moderate to advanced users of Windows and OS/2. "+_
           "DLLs are available with functions allowing users to overcome most of the limitations "+_
           "in Liberty BASIC. The OS/2 version is very old, but free. "+_
           "A new version that will run on Windows, Macintosh and Linux is in active development."
 
text$(4) = "The compiler recognizes its own dialect of the BASIC programming language."
 
text$(5) = "The programming language dialect, and the IDE have developed a market niche for "+_
           "introductory and intermediate programmers who are learning the skills of programming, "+_
           "though it has been less widely adopted as a commercial publishing product. "+_
           "This is not to say that Liberty Basic is educational software only. "+_
           "It is still a commercial product, and can be used to create proprietary software."
 
text$(6) = "In its current version, it runs only on Microsoft Windows, "+_
           "but v5 is in active development and runs on Mac OS X and Linux systems as well, "+_
           "in addition to being 'up to 5 times faster' than the current version, says its author."
 
Cls
HTML "</Div>"
Call setCSS
 
Div TextAreaStyle1
    For i = 1 to 6
       Print text$(i): Print
    Next i
End Div
Wait
 
Sub setCSS
    CSSID #TextAreaStyle1, "{
       Background-Color:#FFFFC0;
       Font-Family: Verdana;
       Font-Size: 12pt;
       Text-Align: Left;
       Color: Black;
       Width: 300px;
       Height: 400px;
       Overflow: Auto;
       Margin-Left: 100px;
       Border-Color: Blue;
       Border-Size: Thick;
       Border-Style: Ridge;
       Padding: 20px 20px 20px 50px;
       }"
End Sub

Indenting Paragraphs

CSSID #SectionPara, "{
        Width: 400px;
        Background-Color: Lime;
        Background-Position: Center Center;
        Text-Indent: 40px;
        Padding: 20px 20px 10px 20px;
        }"
 
a$ = "When, in the course of human events, it becomes necessary " + _
    "for one people to dissolve the political bonds which have " + _
    "connected them with another, and to assume among the powers of " + _
    "the earth, the separate and equal station to which the laws of " + _
    "nature and of nature's God entitle them, a decent respect to the " + _
    "opinions of mankind requires that they should declare the causes " + _
    "which impel them to the separation."
b$ = "We the People of the United States, in Order to form " + _
    "a more perfect Union, establish Justice, insure domestic " + _
    "Tranquility, provide for the common defense, promote the " + _
    "general Welfare, and secure the Blessings of Liberty to " + _
    "ourselves and our Posterity, do ordain and establish this " + _
    "Constitution for the United States of America."
 
CLS
HTML "</Div>"
Div SectionPara
    Print a$
End Div
Div SectionPara
    Print b$
End Div
End

Including a Background

In addition to color, an image may be used as a background for the text
CSSID #SectionPara, "{
        Width: 400px;
        Background-Color: Lime;
        Background-Image: Url('http://www.nps.gov/archive/casa/home/images/usa2.gif');
        Background-Repeat: No-Repeat;
        Background-Position: Center Center;
        Text-Indent: 40px;
        Padding: 20px 20px 10px 20px;
        }"
 
a$ = "When, in the course of human events, it becomes necessary " + _
    "for one people to dissolve the political bonds which have " + _
    "connected them with another, and to assume among the powers of " + _
    "the earth, the separate and equal station to which the laws of " + _
    "nature and of nature's God entitle them, a decent respect to the " + _
    "opinions of mankind requires that they should declare the causes " + _
    "which impel them to the separation."
b$ = "We the People of the United States, in Order to form " + _
    "a more perfect Union, establish Justice, insure domestic " + _
    "Tranquility, provide for the common defense, promote the " + _
    "general Welfare, and secure the Blessings of Liberty to " + _
    "ourselves and our Posterity, do ordain and establish this " + _
    "Constitution for the United States of America."
 
CLS
HTML "</Div>"
Div SectionPara
    Print a$
End Div
Div SectionPara
    Print b$
End Div
End

..