From f43ce687006a1f840b67ae6c48661801679bc337 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mattias=20Andr=C3=A9e?= <maandree@operamail.com> Date: Sun, 28 Oct 2012 02:30:50 +0200 Subject: [PATCH] browser compability --- index.html | 72 +++++++++++++++++++++++++++++++----------------------- screen.css | 23 +++++++++++++++-- 2 files changed, 62 insertions(+), 33 deletions(-) diff --git a/index.html b/index.html index 4aa83a82..3f1901d2 100644 --- a/index.html +++ b/index.html @@ -10,12 +10,11 @@ <title>ponysay</title> </head> <body> + <div class="header"> <table class="header" valign="middle"> <tr> - <td class="title"> - ponysay - </td> + <td class="title">ponysay</td> <td style="width : 100%;"> <a target="page" href="./pages/index.html">intro</a> <a target="page" href="./pages/ponysay/index.html">manual</a> @@ -27,52 +26,63 @@ </tr> </table> </div> - <div style="width : 100%; top : 60px; bottom : 0px; position : absolute;"> + + <div class="main"> <table class="main"> <col id="left"/> <col id="right"/> <tr> + <td valign="top"> <table> + <cols class="image"/> + <cols class="sep"/> + <cols/> + <tr> - <td> - <img alt="ponysay example" src="bonbonlyra.png"/> - </td> + <td><img alt="ponysay example" src="bonbonlyra.png"/></td> + <td></td> </tr> + <tr> <td> <br/> - <div style="width : 100%;"> - <table> - <tr> - <td style="width : 100%;"> - </td> - <td> - <i>recommended reading:</i><br/> - <a target="page" href="./pages/ponysay/Installing.html#Installing">Installing</a><br/> - <a target="page" href="./pages/ponysay/Invoking-ponysay.html#Invoking-ponysay">Basic usage</a><br/> - <a target="page" href="./pages/ponysay/Advanced-usage.html#Advanced-usage">Advanced usage</a><br/> - <a target="page" href="./pages/ponysay/Environment-variables.html#Environment-variables">Configurations</a><br/> - <br/> - <i>external links:</i><br/> - <a target="page" href="./pages/youtube-demo.html">Demonstration</a><br/> - <a target="page" href="./pages/fortune+ponysay.html">ponysay fortunes</a><br/> - <br/> - </td> - </tr> - </table> - </div> + <table class="fill"> + <tr> + + <td class="fill"></td> + + <td> + <i>recommended reading:</i><br/> + <a target="page" href="./pages/ponysay/Installing.html#Installing">Installing</a><br/> + <a target="page" href="./pages/ponysay/Invoking-ponysay.html#Invoking-ponysay">Basic usage</a><br/> + <a target="page" href="./pages/ponysay/Advanced-usage.html#Advanced-usage">Advanced usage</a><br/> + <a target="page" href="./pages/ponysay/Environment-variables.html#Environment-variables">Configurations</a><br/> + <br/> + + <i>external links:</i><br/> + <a target="page" href="./pages/youtube-demo.html">Demonstration</a><br/> + <a target="page" href="./pages/fortune+ponysay.html">ponysay fortunes</a><br/> + <br/> + </td> + + </tr> + </table> </td> + + <td></td> </tr> + </table> </td> - <td valign="top" style="height : 100%;"> - <div id="text"> - <iframe id="page" name="page" src="./pages/index.html"></iframe> - </div> + + <td valign="top"> + <div id="text"><iframe id="page" name="page" src="./pages/index.html"></iframe></div> </td> + </tr> </table> </div> + </body> </html> diff --git a/screen.css b/screen.css index 672508ce..2432ac31 100644 --- a/screen.css +++ b/screen.css @@ -29,7 +29,14 @@ table.header { height : 100%; } -.main { +div.main { + width : 100%; + top : 60px; + bottom : 0px; + position : absolute; +} + +table.main { width : 100%; height : 100%; border : 0; @@ -57,8 +64,12 @@ table.header { width : 100%; } +.fill { + width : 100%; +} + .title { - passing : 4px 0px 8px 10px; + padding : 4px 0px 8px 10px; /* position : relative; left : 0px; @@ -72,6 +83,14 @@ table.header { text-decoration : none; } +cols.image { + width : 487px; +} + +cols.sep { + width : 53px; +} + a:link {color : #000000; text-decoration : none; border : 0px solid #FFFFFF; background-color : transparent;} a:active {color : #000000; text-decoration : none; border : 0px solid #FFFFFF; background-color : transparent;}