Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jul 2007
    Posts
    54
    Thanks
    17
    Thanked 0 Times in 0 Posts

    New to tables question

    Hi all,

    I am trying tp put 2 contact information side by side, but they always end one on top of each other. I think the way I am putting my tags is wrong. Can't seem to figure it out, though.

    Here is the code that I am working with:
    Code:
    <tr>
     <td align="left" valign="top"><table width="100%" cellpadding="0" cellspacing="0" id="">
      <tr>
       <br><br><td align="left"><span class="rightheader"><b><font size="4">Edmonton<br>
    	West End<br>
    	(780)455-8157<br>
    	FAX(780)451-9334<br>
    	<a href="mailto:cded@camerondriver.com">cded@camerondriver.com</a><br>
    	15879 - 116 Avenue<br>
    	T5M 3W1<br>
    	Out of Town Toll Free<br>
    	1-800-661-7031<br></font></b>
        </span>
       </tr>
     </td>
    </tr>
    
    <tr>
     <td align="left" valign="top"><table width="100%" cellpadding="0" cellspacing="0" id="">
      <tr>
       <br><br><td align="left"><span class="rightheader"><b><font size="4">Red Deer<br>
    	(403)341-4711<br>
    	FAX (403)341-4716<br>
    	<a href="mailto:rdcd@camerondriver.com">rdcd@camerondriver.com</a><br>
          Bay 8 - 7439 — 49 Avenue Cr.<br>
          T4P 1X6<br>
          Out of Town Toll Free<br>
    	1-888-343-4711<br><br>
    <br>
    <br>
        </span>
       </tr>
     </td>
    </tr>
    Here is what it looks like right now

    http://www.camerondriver.com/contact.php


    Thanks in advance,

    Heeter

  • #2
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    well you are putting them in seperate <tr>, those are the rows, try this

    Code:
    <table>
    <tr>
     <td align="left" valign="top"><table width="100&#37;" cellpadding="0" cellspacing="0" id=""></td>
    <td align="left" valign="top"><table width="100%" cellpadding="0" cellspacing="0" id=""></td>
    </tr>
      <tr>
       <br><br><td align="left"><span class="rightheader"><b><font size="4">Edmonton<br>
    	West End<br>
    	(780)455-8157<br>
    	FAX(780)451-9334<br>
    	<a href="mailto:cded@camerondriver.com">cded@camerondriver.com</a><br>
    	15879 - 116 Avenue<br>
    	T5M 3W1<br>
    	Out of Town Toll Free<br>
    	1-800-661-7031<br></font></b>
        </span>
     </td>
    <td><br><br><td align="left"><span class="rightheader"><b><font size="4">Red Deer<br>
    	(403)341-4711<br>
    	FAX (403)341-4716<br>
    	<a href="mailto:rdcd@camerondriver.com">rdcd@camerondriver.com</a><br>
          Bay 8 - 7439 — 49 Avenue Cr.<br>
          T4P 1X6<br>
          Out of Town Toll Free<br>
    	1-888-343-4711<br><br>
    <br>
    <br>
        </span>
    </td>
    </tr>
    
    </table>
    see if that works better for you

  • Users who have thanked jcdevelopment for this post:

    Heeter (02-20-2008)

  • #3
    Regular Coder
    Join Date
    Jan 2008
    Location
    Willow Grove, PA
    Posts
    169
    Thanks
    1
    Thanked 27 Times in 27 Posts
    If you are just learning tables, then you should know that using tables as a method of laying out content that isn't data related is bad.

    Try this instead:

    Styles:
    Code:
    address {
    	float: left;
    	font-size: 12pt;
    	font-style: normal;
    	margin-right: 20px;
    }
    Code:
    Code:
    <address>
    Edmonton<br />
    West End<br />
    (780)455-8157<br />
    FAX(780)451-9334<br />
    <a href="mailto:cded@camerondriver.com">cded@camerondriver.com</a><br />
    15879 - 116 Avenue<br />
    T5M 3W1<br />
    Out of Town Toll Free<br />
    1-800-661-7031
    </address>
    
    <address>
    Red Deer<br />
    (403)341-4711<br />
    FAX (403)341-4716<br />
    <a href="mailto:rdcd@camerondriver.com">rdcd@camerondriver.com</a><br />
    Bay 8 - 7439 — 49 Avenue Cr.<br />
    T4P 1X6<br />
    Out of Town Toll Free<br />
    1-888-343-4711
    </address>
    Result: Cleaner code and semantic meaning behind the tags and the data.
    Last edited by sobrien79; 02-20-2008 at 09:35 PM.

  • Users who have thanked sobrien79 for this post:

    Heeter (02-20-2008)

  • #4
    New Coder
    Join Date
    Jul 2007
    Posts
    54
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Awesome, much, much nicer!!!

    I am still trying to get it to put each other side by side, instead of one contact on top of the other.

    Should I put in a second entry into the css then?

    Thanks,

    UPDATE:::: Now I see what you mean.

    It is still a little wonky for me but I can see where this is going.

    Thanks again.
    Last edited by Heeter; 02-20-2008 at 10:00 PM.

  • #5
    Regular Coder
    Join Date
    Jan 2008
    Location
    Willow Grove, PA
    Posts
    169
    Thanks
    1
    Thanked 27 Times in 27 Posts
    the float: left css declaration puts the 2 items next to one another. The address in the css will match all address elements in the html. Not just the first so there is no need to add more to the css than what I provided.

    Either what I or jcdevelopment suggested should work though.

  • Users who have thanked sobrien79 for this post:

    Heeter (02-20-2008)

  • #6
    New Coder
    Join Date
    Jul 2007
    Posts
    54
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Thanks you guys,

    It looks really good, like I want it now.

    Thanks to both of you.

    Heeter


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •