1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

HTML and Dreamweaver Table woes!

Discussion in 'White Hat SEO' started by turbopugsleylx, Jun 10, 2010.

  1. turbopugsleylx

    turbopugsleylx Jr. VIP Jr. VIP Premium Member

    Joined:
    Jun 6, 2008
    Messages:
    3,151
    Likes Received:
    965
    Occupation:
    www.xgcmedia.com
    Location:
    www.xgcmedia.com
    Home Page:
    Hey guys I designed a logo and sub banner for my site and then sliced the image into multiple parts....I plugged it into a table in dreamweaver and now I am seeing big gaps in between the individual pictures of the sub banner....how do I fix this?

    Heres the code

    Code:
    <table border=0 cellpadding=0 cellspacing=0>
            <tr>
                <td colspan=7 background="images/myimage1.jpg" width=1099 height=100><div style="text-align:right; margin-right:160px;"></div></td>
            </tr>
            <tr>
                <td><img src="images/gs_02.jpg"></td>
                <td><a href="mysite.html"><img src="images/gs_03.jpg" border=0></a></td>
                <td><a href="mysite2.html"><img src="images/gs_04.jpg" border=0></a></td>
                <td><a href="mysite3.html"><img src="images/gs_05.jpg" border=0></a></td>
                <td><a href="mysite4.html"><img src="images/gs_06.jpg" border=0></a></td>
                <td><a href="mysite5.html"><img src="images/gs_07.jpg" border=0></a></td>
                <td><img src="images/gs_08.jpg"></td>
                <td><img src="images/gs_09.jpg"></td>
                <td><img src="images/gs_10.jpg"></td>
            </tr>
            <tr>
                <td width=1099 colspan=7 background="images/gf_44-1.jpg" class=tet>
                    <div style="padding:70px; padding-right:70px; padding-top:30px; background:url(images/fg_14.jpg) top no-repeat;">
    Any help?
     
  2. tacopalypse

    tacopalypse Executive VIP Jr. VIP Premium Member

    Joined:
    Nov 30, 2009
    Messages:
    980
    Likes Received:
    2,485
    Home Page:
    table's too wide?

    if that's not it, maybe u could post a screenshot since the code looks fine... you took care of the borders and padding/spacing already.
     
  3. turbopugsleylx

    turbopugsleylx Jr. VIP Jr. VIP Premium Member

    Joined:
    Jun 6, 2008
    Messages:
    3,151
    Likes Received:
    965
    Occupation:
    www.xgcmedia.com
    Location:
    www.xgcmedia.com
    Home Page:
    I used the table code from another site...just plugged in my logo and sub banner with the same dimensions...weird thing is it works on their site but dreamweaver is showing spaces when I plug my pics in...
     
  4. chockomonkey

    chockomonkey Regular Member

    Joined:
    Mar 27, 2009
    Messages:
    366
    Likes Received:
    40
    Location:
    the States
    in my experience the dreamweaver preview is almost never exactly how it shows up in a real browser. Never could find out why... but that's the mileage i've had.

    Sometimes browsers will make assumptions on the coder's behalf to make sure that errors in code still display. You could try adding the table to a class and then write a css rule to make sure the table and its contents don't have any margins...

    Code:
    .tableclass {
        margin: 0px;
    }
    
    If your browser is adding a default margin of 0px, then that might explain the discrepancy.
     
  5. eshera

    eshera Registered Member

    Joined:
    Nov 13, 2008
    Messages:
    58
    Likes Received:
    108
    Just a thought...add your image height and width so the browser doesn't "assume".
     
  6. turbopugsleylx

    turbopugsleylx Jr. VIP Jr. VIP Premium Member

    Joined:
    Jun 6, 2008
    Messages:
    3,151
    Likes Received:
    965
    Occupation:
    www.xgcmedia.com
    Location:
    www.xgcmedia.com
    Home Page:
    I think I figured it out...I went to visual and merged cells...it appears DW and FF doesnt like pics on indivdual lines and wants them back to back in one group.....though now the there is a line of color on top of the categories banner (between the logo and categories section below it)

    Heres the updated code
    Code:
    <table border=0 cellpadding=0 cellspacing=0>
            <tr>
                <td background="/images/bs_01.jpg" width=1100 height=105><div style="text-align:right; margin-right:160px;"></div></td>
            </tr>
            <tr>
                <td colspan="4"><img src="/images/bs_02.jpg"><img src="/images/bs_03.jpg" border=0></a><a href="mysite.html"><img src="/images/bs_04.jpg" border=0></a><a href="mysite.html"><img src="/images/bs_05.jpg" border=0></a><a href="mysite.html"><img src="/images/bs_06.jpg" border=0></a><a href="mysite.html"><img src="/images/bs_07.jpg" border=0></a><img src="/images/bs_08.jpg"><img src="/images/bs_09.jpg"><img src="/images/bs_10.jpg"><img src="/images/bs_11.jpg"></td>
            </tr>
            <tr>
                <td width=1100 background="/images/gh_1.jpg" class=tet>
                    <div style="padding:70px; padding-right:70px; padding-top:30px; background:url(images/po_1.jpg) top no-repeat;">
     
    Last edited: Jun 10, 2010