I’ve put some tables on my site like on this page.
Official Apple 30-pin to USB Cable for iPhone 4 4S iPad iPod
The tables are defined with border=‘0’ yet they have border (really fine ones) around them on my site.
When I try the HTML code in the W3 school test window, they have no border. I checked by changing the 0 to 1 and the border appeared, changed back to 0 and the border disappeared. Just not on CS-Cart.
Anyone know why?
FYI, this is the HTML for my table.
 |
 |
 |
 |
Us the debugger in your browser and look at the styles for the table (usually right-click and “Inspect element” or similar). You can then see the styles being applied.
When I right click > inspect element and select the table, I get this
border: 0px none;
font-size: 100%;
margin: 0px;
padding: 0px;
Yet still got a border round it?
This is everything from the inspect element from the table
element {
}
table {
border-collapse: collapse;
border-spacing: 0px;
}
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video, xmp {
font-size: 100%;
margin: 0px;
padding: 0px;
border: 0px none;
}
body, div, p, .tabs ul li.active a, .tabs ul li.active a:visited, .tabs ul li.active a:hover, .tabs ul li.active a:active, .checkout-sidebox-title, .demo-site-panel select {
color: #333;
}
body, div, span, li, td, input[type=“text”], input[type=“password”], textarea, select, .scroll-y, .ui-widget select, .ui-widget textarea, .ui-widget, .ui-dialog .ui-dialog-title, a, a:visited, a:active, .popup-title:hover > a, .popup-title.unlogged a, .popup-title.logged a, .minicart-title, ul.dropdown-multicolumns li a {
font-family: Arial,Helvetica,sans-serif;
font-size: 13px;
font-weight: normal;
font-style: normal;
}
.product-note span, .product-main-info #content_description {
line-height: 140%;
}
Go to the outer element. It may have a border that is making the table appear that it does. I.e. the surrounding div.
Thanks The Tool!
Would I need to edit each cell individually or is there way of doing them all at once?
[quote name='SeanDigitalSave' timestamp='1427460002' post='209273']
Would I need to edit each cell individually or is there way of doing them all at once?
[/quote]
Please add the following rule to the CSS section of the Theme editor:
#content_description table td {
border: none;
}
Edit: Ecom beat me.
Haha thank you so much! Easy this web design lark isn't it haha. Thanks guys, buy yourselves a beer this weekend from me!