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 5 of 5
  1. #1
    New Coder
    Join Date
    Jun 2003
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Question Table border question

    In this website, I narrow the table size to 40% of the page width. However, the outlining stays as wide as the entire page.

    http://www.sjwum.org/SJWUM-about.html

    On the page:

    <div id="para">
    <table style="width: 40%;" border="1"
    cellpadding="2" cellspacing="2">
    <tbody>
    <tr>
    <td style="vertical-align: top;"><br>
    <br>
    If you want to know about Serving Jesus Willingly Urgan Ministries,
    then take a look at our <br>
    <a href="SJWUM-givefood.html">monthly
    food giveaway.</a> <br>
    </td>
    <td valign="top"><img
    src="1vegetable1-med.jpg" alt="" height="187"
    width="250"> <br>
    </td>
    </tr>
    </tbody>
    </table>
    </div>

    In the stylesheet:


    table { font-family: "Arial";
    text-align:center;
    border-style: none;
    }
    td { border-style: none;
    }

    }
    #para {
    border-style:ridge;
    border-color:"#006600";
    }

    Thanks

  • #2
    Regular Coder
    Join Date
    Mar 2011
    Posts
    148
    Thanks
    0
    Thanked 20 Times in 20 Posts
    Hy,
    Try this code:
    Code:
    <style type="text/css">
    #para {
    position:relative;
    margin:1px auto;
    text-align:center;
    }
    
    table {
    position:relative;
    margin:1px auto;
    font-family: "Arial";
    text-align:center;
    border-style:ridge;
    }
    td { border-style: none; }
    </style>
    
    <div id="para">
    <table style="width:40%;" border="1" cellpadding="2" cellspacing="2">
    <tbody>
    <tr>
    <td style="vertical-align: top;"><br>
    <br>
    If you want to know about Serving Jesus Willingly Urgan Ministries,
    then take a look at our <br>
    <a href="SJWUM-givefood.html">monthly
    food giveaway.</a> <br>
    </td>
    <td valign="top"><img
    src="1vegetable1-med.jpg" alt="" height="187"
    width="250"> <br>
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    
    In the stylesheet:

  • #3
    New Coder
    Join Date
    Jun 2003
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts

    position:relative; did not make a difference.

    Sorry to say, the position:relative; did not make a difference. (I changed to box to red just be sure what I was doing was changing it at all)

    http://www.sjwum.org/SJWUM-about.html

    Other ideas??

  • #4
    Senior Coder alykins's Avatar
    Join Date
    Apr 2011
    Posts
    1,823
    Thanks
    42
    Thanked 199 Times in 198 Posts
    First note, I am sorta new to coding as well... but looking at your code I see some stuff that I think could be affecting your code... But I am not a Sr developer by any means... but ideas to try...



    Quote Originally Posted by waynefrank View Post
    <div id="para">
    <table style="width: 40%;" border="1"
    cellpadding="2" cellspacing="2">
    you can just set <table width= "40%" border= 1 cellpadding= 2 cellspacing=2>


    Quote Originally Posted by waynefrank View Post
    <td style="vertical-align: top;">

    <td valign="top">
    The top is css format while the bottom is html format. (I could be wrong) but either way they are two conflicting formats used within the same table. I would fiddle with those. Hope that helps some

  • #5
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,338
    Thanks
    5
    Thanked 363 Times in 360 Posts
    I have to ask why are you using tables at all? Read about why tables for layouts are bad here.
    Teed


  •  

    Tags for this Thread

    Posting Permissions

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