|
This browse window is 00 pixels wide.
this is w0
this is w1
this is w2
this is w3
this is w4
this is w5
this is w6
this is w7
Your browser window is 00 pixels wide.
w0.css
w1.css
w2.css
w3.css
w4.css
w5.css
w6.css
w7.css
Show All
The variable status of the page is: ??
The active style sheet(s) are: ??
This page is designed for visually testing the
transition points between style sheets.
<BODY onload='VariableStyle()' onresize='ShowWidth()'>
Variable HTML is designed to automatically redesign a webpage as
the browser window changes size. This feature makes it almost
impossible for a designer to test the transition points between
style sheets. It can be turned off by pre-definition the onresize
argument of the body tag.
<b id=variableStatus>00</b>
Variable HTML
<b id=widthOfPage>00</b>
Variable HTML
<a href='javascript:setWid(6);'>00</a>
Variable HTML
| Width |
Pixels |
85 |
191 |
fluid |
fluid |
191 |
55 |
Fixed |
C |
| 380 |
Style 0 |
|
Nav Content |
|
0 |
1 |
| 480 |
Style 1 |
small book |
|
Nav Content |
|
small book |
47 |
1 |
| 640 |
Style 2 |
book |
|
Nav Content |
|
book |
140 |
1 |
| 725 |
Style 3 |
book |
|
Content |
Nav Ads |
book |
331 |
1 |
| 1020 |
Style 4 |
book |
Ads |
Content |
Nav |
book |
522 |
1 |
| 1215 |
Style 5 |
book |
|
Con |
tent |
Nav Ads |
book |
331 |
2 |
| 1700 |
Style 6 |
book |
Ads |
Con |
tent |
Nav |
book |
522 |
2 |
| 0 |
Style 7 |
Same as above, limited to 1700 pixels |
522+ |
2 |
| w0.css |
|
screen.css |
topnav.css |
toc.css |
notrimone.css |
| w1.css |
book3.css |
screen.css |
topnav.css |
toc.css |
notrimone.css |
| w2.css |
book.css |
screen.css |
topnav.css |
toc.css |
one.css |
| w3.css |
book.css |
screen.css |
topnav.css |
toc.css |
onenav.css |
| w4.css |
book.css |
screen.css |
topnav.css |
toc.css |
adsonenav.css |
| w5.css |
book.css |
screen.css |
topnav.css |
toc.css |
twonav.css |
| w6.css |
book.css |
screen.css |
topnav.css |
toc.css |
adstwonav.css |
| w7.css |
book.css |
screen.css |
topnav.css |
toc.css |
adstwonav.css |
Dummy "Lorum Ipsum" Text.
Duis autem vel eum iriure dolor in hendrerit in vulputate
velit esse molestie consequat, vel illum dolore eu feugiat nulla
facilisis at vero eros et accumsan et iusto odio dignissim qui
blandit praesent luptatum zzril delenit augue duis dolore te feugait
nulla facilisi.
Column 1
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo
consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate
velit esse molestie consequat, vel illum dolore eu feugiat nulla
facilisis at vero eros et accumsan et iusto odio dignissim qui
blandit praesent luptatum zzril delenit augue duis dolore te feugait
nulla facilisi.
Column 2
Nam liber tempor cum soluta nobis eleifend option
congue nihil imperdiet doming id quod mazim placerat facer possim
assum. Typi non habent claritatem insitam; est usus legentis in iis
qui facit eorum claritatem. Investigationes demonstraverunt lectores
legere me lius quod ii legunt saepius. Claritas est etiam processus
dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est
notare quam littera gothica, quam nunc putamus parum claram,
anteposuerit litterarum formas humanitatis per seacula quarta
decima et quinta decima. Eodem modo typi, qui nunc nobis videntur
parum clari, fiant sollemnes in futurum.
|