examples/layout/calendar.html
authorEdward <edward@roojs.com>
Wed, 9 Apr 2014 09:41:18 +0000 (17:41 +0800)
committerEdward <edward@roojs.com>
Wed, 9 Apr 2014 09:41:18 +0000 (17:41 +0800)
examples/layout/calendar.html

index 6627c6f..2118f87 100644 (file)
     <link rel="stylesheet" type="text/css" href="../examples.css" />
   <link rel="stylesheet" href="../../css-bootstrap/calendar.css">    
 
+ <style type="text/css">
+                           */
 
+/* define height and width of scrollable area. Add 16px to width for scrollbar          */
+div.fc-view {
+       clear: both;
+       border: 1px solid #963;
+       height: 285px;
+       overflow: auto;
+       width: 756px
+}
+
+/* Reset overflow value to hidden for all non-IE browsers. */
+html>body div.fc-view {
+       overflow: hidden;
+       width: 756px
+}
+
+/* define width of table. IE browsers only                 */
+div.fc-view table {
+       float: left;
+       width: 740px
+}
+
+/* define width of table. Add 16px to width for scrollbar.           */
+/* All other non-IE browsers.                                        */
+html>body div.fc-view table {
+       width: 756px
+}
+
+/* set table header to a fixed position. WinIE 6.x only                                       */
+/* In WinIE 6.x, any element with a position property set to relative and is a child of       */
+/* an element that has an overflow property set, the relative value translates into fixed.    */
+/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
+thead tr {
+       position: relative
+}
+
+/* set THEAD element to have block level attributes. All other non-IE browsers            */
+/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
+html>body thead tr {
+       display: block
+}
+
+/* make the TH elements pretty */
+thead th {
+       background: #C96;
+       border-left: 1px solid #EB8;
+       border-right: 1px solid #B74;
+       border-top: 1px solid #EB8;
+       font-weight: normal;
+       padding: 4px 3px;
+       text-align: left
+}
+
+/* make the A elements pretty. makes for nice clickable headers                */
+thead a, thead a:link, thead a:visited {
+       color: #FFF;
+       display: block;
+       text-decoration: none;
+       width: 100%
+}
+
+/* make the A elements pretty. makes for nice clickable headers                */
+/* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
+thead a:hover {
+       color: #FFF;
+       display: block;
+       text-decoration: underline;
+       width: 100%
+}
+
+/* define the table content to be scrollable                                              */
+/* set TBODY element to have block level attributes. All other non-IE browsers            */
+/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
+/* induced side effect is that child TDs no longer accept width: auto                     */
+html>body tbody {
+       display: block;
+       height: 262px;
+       overflow: auto;
+       width: 100%
+}
+
+/* make TD elements pretty. Provide alternating classes for striping the table */
+/* http://www.alistapart.com/articles/zebratables/                             */
+tbody td, tbody tr.normalRow td {
+       background: #FFF;
+       border-bottom: none;
+       border-left: none;
+       border-right: 1px solid #CCC;
+       border-top: 1px solid #DDD;
+       padding: 2px 3px 3px 4px
+}
+
+tbody tr.alternateRow td {
+       background: #EEE;
+       border-bottom: none;
+       border-left: none;
+       border-right: 1px solid #CCC;
+       border-top: 1px solid #DDD;
+       padding: 2px 3px 3px 4px
+}
+
+/* define width of TH elements: 1st, 2nd, and 3rd respectively.          */
+/* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
+/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
+html>body thead th {
+       width: 200px
+}
+
+html>body thead th + th {
+       width: 240px
+}
+
+html>body thead th + th + th {
+       width: 316px
+}
+
+/* define width of TD elements: 1st, 2nd, and 3rd respectively.          */
+/* All other non-IE browsers.                                            */
+/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
+html>body tbody td {
+       width: 200px
+}
+
+html>body tbody td + td {
+       width: 240px
+}
+
+html>body tbody td + td + td {
+       width: 300px
+}
+-->
+</style>
 
 </head>
 <body style="height:500px">