"schedule"
Bootstrap 3.3.0 Snippet by hossam

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="agendaContainer" style="border-width:6px 9px"> <div id="working" style="display:none"><img class="rnd" id="ajaxspin" src="//d304pchb3b61hb.cloudfront.net/img/progress.gif" alt="Working…"></div> <div id="noroom" style="display:none"></div> <div id="viewholder"><table class="weekCont" id="container" cellspacing="0" cellpadding="0" style="border-style: none; table-layout: auto;"> <thead><tr class="dayHeading"><th width="41px"> </th> <th id="h0" style="display: none;"><div class="fixwidth">Sun 3-13</div></th> <th id="h1" class="todayHead"><div class="fixwidth">Mon 3-14</div></th> <th id="h2"><div class="fixwidth">Tue 3-15</div></th> <th id="h3"><div class="fixwidth">Wed 3-16</div></th> <th id="h4"><div class="fixwidth">Thu 3-17</div></th> <th id="h5"><div class="fixwidth">Fri 3-18</div></th> <th id="h6" style="display: none;"><div class="fixwidth">Sat 3-19</div></th></tr></thead> <tbody style="line-height:21px"><tr><td id="hours"> <table width="100%" cellspacing="0" cellpadding="2" class="hour"><tbody><tr class="e"><td>9 am</td></tr><tr class="o"><td> </td></tr> <tr class="e"><td>10 am</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>11 am</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>Noon</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>1 pm</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>2 pm</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>3 pm</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>4 pm</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>5 pm</td></tr><tr class="o"><td> </td></tr><tr class="e"> <td>6 pm</td></tr><tr class="o"><td> </td></tr></tbody></table></td> <td id="hh0" style="display: none;"><div id="d0" class="day closed" onclick="chandle(event,0)"><div id="g0"></div><div id="e0"></div><div id="a0"><div style="position:absolute"></div></div> <table width="100%" class="p0 l"> <tbody><tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> <tr class="e"><td> </td></tr> <tr class="o"><td> </td></tr> </tbody></table></div></td><td id="hh1"><div id="d1" class="day today rd" onclick="chandle(event,1)"><div id="g1"></div><div id="e1"></div><div id="a1"><div style="position:absolute"></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td><td id="hh2"><div id="d2" class="day rd" onclick="chandle(event,2)"><div id="g2"></div><div id="e2"></div><div id="a2"><div style="top:156px;left:0%;right:0%" class="chip rd" onclick="hce(event,5918402)" title="Team meeting 3 administrator"><div class="of bcol2"></div><div class="if bcol2"></div><div style="height:151px" class="out f col2"><div class="head bcol2"> 12:00pm − 3:00pm</div><div class="in">Team meeting 3<br>administrator</div></div><div class="if f col2 lb rb"></div><div class="of bcol2"></div></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td><td id="hh3"><div id="d3" class="day rd" onclick="chandle(event,3)"><div id="g3"></div><div id="e3"></div><div id="a3"><div style="top:156px;left:0%;right:0%" class="chip rd" onclick="hce(event,5918405)" title="Team meeting 3 administrator"><div class="of bcol2"></div><div class="if bcol2"></div><div style="height:151px" class="out f col2"><div class="head bcol2"> 12:00pm − 3:00pm</div><div class="in">Team meeting 3<br>administrator</div></div><div class="if f col2 lb rb"></div><div class="of bcol2"></div></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td><td id="hh4"><div id="d4" class="day rd" onclick="chandle(event,4)"><div id="g4"></div><div id="e4"></div><div id="a4"><div style="position:absolute"></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td><td id="hh5"><div id="d5" class="day rd" onclick="chandle(event,5)"><div id="g5"></div><div id="e5"></div><div id="a5"><div style="position:absolute"></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td><td id="hh6" style="display: none;"><div id="d6" class="day closed" onclick="chandle(event,6)"><div id="g6"></div><div id="e6"></div><div id="a6"><div style="position:absolute"></div></div><table width="100%" class="p0 l"><tbody><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr><tr class="e"><td> </td></tr><tr class="o"><td> </td></tr></tbody></table></div></td></tr><tr id="oor" class="oor" style="display:none"><td> </td><td id="oor0" style="display: none;"></td><td id="oor1"></td><td id="oor2"></td><td id="oor3"></td><td id="oor4"></td><td id="oor5"></td><td id="oor6" style="display: none;"></td></tr></tbody></table></div> </div>
element.style { border-width: 6px 9px; } div.agendaContainer { border: solid 6px #C3D9FF; border-bottom-width: 4px; } user agent stylesheet div { display: block; } Inherited from body body { font-family: sans-serif; color: #575757; font-size: 11pt; margin: 0 0 5px 0; }

Related: See More


Questions / Comments: