Wrapping div elements 1

FesterSXS · Apr 29, 2005

I have an availability calendar with a layout issue. It follows this structure:

Code:

<style>
div.year   {}
div.quarter   {}
table.month   {float: left;}
</style>
...
...
...
<div class="year">
  <div class="quarter">
    <table class="month">Jan</table>
    <table class="month">Feb</table>
    <table class="month">Mar</table>
  </div>
  <div class="quarter">
    <table class="month">Apr</table>
    <table class="month">May</table>
    <table class="month">Jun</table>
  </div>
  etc...
</div>

Online example:

http://www.SpiraxSarco.com/villa/availability.asp

I would like the calendar to show each quarter on a new line. Whenever I use clear="left" it puts the next quarter at the bottom of the left-hand menu. Note: The online example doesn't use clear="left" so the months are all in a line

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

FesterSXS · Apr 29, 2005

before anyone comments - yes I know the dates are wrong

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

cLFlaVA · Apr 29, 2005

does this help?

Code:

<style type="text/css">
div.quarter { }
table.month {
    display: inline;
}
</style>

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

FesterSXS · Apr 29, 2005

oh yes that's great thanks. They don't line up along the top edge anymore though. Is there an equivalent of valign in CSS to apply to the <div class="quarter">

ALso - FF seems to be displaying the th borders incorrectly now. I have used th for the letters of the day in each month table.

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

FesterSXS · Apr 29, 2005

ignore the th comment above. Its not them that is causing the problem. It is the colspan row above them that is incorrectly bordered with FF

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

cLFlaVA · Apr 29, 2005

valign doesn't really work well x-browser. some browsers only allow it to be used with images.

what exactly is the problem?

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

cLFlaVA · Apr 29, 2005

sorry bud, i was being lazy...
try this, tell me if it's more suitable:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]

<html>
<head>
<title>Untitled</title>

<style type="text/css">

div.quarter {
    display: block;
    clear: both;
}
table.month {
    border: 1px solid black;
    float: left;
}

</style>

</head>

<body>

<div class="year">
<div class="quarter">

<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">January 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>

<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
</tr>
<tr>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>

<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
</tr>
<tr>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="afternoon"><span>10</span></td>
<td align="center" class="allday"><span>11</span></td>
<td align="center" class="morning"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>

<td align="center" class="available"><span>15</span></td>
</tr>
<tr>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>

</tr>
<tr>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
</tr>

<tr>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">February 2005</span></td>
</tr>

<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>

<td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="afternoon"><span>7</span></td>
</tr>
<tr>
<td align="center" class="allday"><span>8</span></td>

<td align="center" class="allday"><span>9</span></td>
<td align="center" class="allday"><span>10</span></td>
<td align="center" class="allday"><span>11</span></td>
<td align="center" class="allday"><span>12</span></td>
<td align="center" class="allday"><span>13</span></td>
<td align="center" class="morning"><span>14</span></td>
</tr>
<tr>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>

<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
</tr>
<tr>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>

<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
</tr>
</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">March 2005</span></td>
</tr>
<tr>
<th align="center">S</th>

<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>

<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
</tr>
<tr>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>

<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
</tr>
<tr>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>

<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
</tr>
<tr>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>

<td align="center" class="available"><span>27</span></td>
</tr>
<tr>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

</div>
<div class="quarter">
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">April 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>

<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>

</tr>
<tr>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
</tr>

<tr>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
</tr>
<tr>

<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
</tr>
<tr>
<td align="center" class="available"><span>27</span></td>

<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">May 2005</span></td>
</tr>
<tr>

<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>

<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
</tr>
<tr>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>

<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
</tr>
<tr>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>

<td align="center" class="available"><span>18</span></td>
</tr>
<tr>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>

</tr>
<tr>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
</tr>
</table>

<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">June 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>

<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
</tr>
<tr>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>

<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
</tr>
<tr>
<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>

<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
</tr>
<tr>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>

<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
</tr>
<tr>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>

<td>&nbsp;</td>
</tr>
</table>

</div>
<div class="quarter">
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">July 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>

<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
</tr>
<tr>
<td align="center" class="available"><span>3</span></td>

<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
</tr>
<tr>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>

<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
</tr>
<tr>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>

<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
</tr>
<tr>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>

<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
</tr>
<tr>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>

</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">August 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>

<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
</tr>
<tr>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>

<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
</tr>
<tr>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>

<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
</tr>
<tr>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>

<td align="center" class="available"><span>22</span></td>
</tr>
<tr>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>

</tr>
<tr>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">September 2005</span></td>

</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>

<tr>
<td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
</tr>
<tr>

<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>
</tr>
<tr>
<td align="center" class="available"><span>15</span></td>

<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
</tr>
<tr>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>

<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
</tr>
<tr>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td>&nbsp;</td>

<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

</div>
<div class="quarter">
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">October 2005</span></td>
</tr>
<tr>
<th align="center">S</th>

<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>

<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
</tr>
<tr>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>

<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
</tr>
<tr>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>

<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
</tr>
<tr>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>

<td align="center" class="available"><span>27</span></td>
</tr>
<tr>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">November 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>
<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>

<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>
<td align="center" class="available"><span>5</span></td>
</tr>
<tr>
<td align="center" class="available"><span>6</span></td>

<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
<td align="center" class="available"><span>12</span></td>
</tr>
<tr>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>

<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
<td align="center" class="available"><span>19</span></td>
</tr>
<tr>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>

<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
<td align="center" class="available"><span>26</span></td>
</tr>
<tr>
<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>

<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<table width="200" cellspacing="0" cellpadding="0" class="month">
<tr>
<td colspan="7" align="center"><span class="monthname">December 2005</span></td>
</tr>
<tr>
<th align="center">S</th>
<th align="center">M</th>
<th align="center">T</th>

<th align="center">W</th>
<th align="center">T</th>
<th align="center">F</th>
<th align="center">S</th>
</tr>
<tr>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td align="center" class="available"><span>1</span></td>
<td align="center" class="available"><span>2</span></td>
<td align="center" class="available"><span>3</span></td>
<td align="center" class="available"><span>4</span></td>

</tr>
<tr>
<td align="center" class="available"><span>5</span></td>
<td align="center" class="available"><span>6</span></td>
<td align="center" class="available"><span>7</span></td>
<td align="center" class="available"><span>8</span></td>
<td align="center" class="available"><span>9</span></td>
<td align="center" class="available"><span>10</span></td>
<td align="center" class="available"><span>11</span></td>
</tr>

<tr>
<td align="center" class="available"><span>12</span></td>
<td align="center" class="available"><span>13</span></td>
<td align="center" class="available"><span>14</span></td>
<td align="center" class="available"><span>15</span></td>
<td align="center" class="available"><span>16</span></td>
<td align="center" class="available"><span>17</span></td>
<td align="center" class="available"><span>18</span></td>
</tr>
<tr>

<td align="center" class="available"><span>19</span></td>
<td align="center" class="available"><span>20</span></td>
<td align="center" class="available"><span>21</span></td>
<td align="center" class="available"><span>22</span></td>
<td align="center" class="available"><span>23</span></td>
<td align="center" class="available"><span>24</span></td>
<td align="center" class="available"><span>25</span></td>
</tr>
<tr>
<td align="center" class="available"><span>26</span></td>

<td align="center" class="available"><span>27</span></td>
<td align="center" class="available"><span>28</span></td>
<td align="center" class="available"><span>29</span></td>
<td align="center" class="available"><span>30</span></td>
<td align="center" class="available"><span>31</span></td>
<td>&nbsp;</td>
</tr>
</table>

</div>
</div>



</body>
</html>

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

FesterSXS · Apr 29, 2005

that lines them up but it puts them under the left-hand nav - take a look online to see -

http://www.spiraxsarco.com/villa/availability.asp

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

FesterSXS · Apr 29, 2005

off home now - back on Tuesday although might be able to go online at home over weekend.

Thanks for your help Cory

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

cLFlaVA · Apr 29, 2005

sorry, went out to lunch...
i'll post back in a few minutes.

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

FesterSXS · May 3, 2005

OK - I've got this sorted now...

Code:

<style>
div.month {
 float: left;
 width: 212px; 
 height: 137px; 
 margin: 5px;}

table.month {
 border: 1px solid #000000;}

table.month td, table.month th {
 border: 1px solid #000000;}
</style>
...
...
...
...
...
<div class="month">
  <table class="month"><!-- January --></table>
</div>
<div class="month">
  <table class="month"><!-- February --></table>
</div>
<div class="month">
  <table class="month"><!-- March--></table>
</div>
etc...

Thanks for your help Cory. Got another little problem but I'll start a new thread.

Tony
[red]_________________________________________________________________[/red]
Webmaster -

http://www.SpiraxSarco.com/

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Wrapping div elements 1

FesterSXS

Programmer

FesterSXS

Programmer

cLFlaVA

Programmer

FesterSXS

Programmer

FesterSXS

Programmer

cLFlaVA

Programmer

cLFlaVA

Programmer

FesterSXS

Programmer

FesterSXS

Programmer

cLFlaVA

Programmer

FesterSXS

Programmer

Similar threads

Part and Inventory Search

Sponsor