irishpeck Posted June 2, 2009 Share Posted June 2, 2009 If you visit www.flog-it.ie you will see that all the images which are links have a black border around it. But when i change this to the same colour as the background colour it changes all the links in the middle of the page for the categories. How can i take the border off the images and keep the category links the same colour as they are? The css file is below in full. ************************************************************* body { font-family: Verdana; font-size: 11px; margin: 0px; padding: 0px; } td { font-size: 11px; } h1 { font-size: 16pt; margin: 0px; } h2 { font-size: 14px; font-weight: bold; margin-top: 0px; padding-top: 0px; margin-bottom: 10px; } h3 { font-size: 12px; font-weight: bold; margin-top: 0px; padding-top: 0px; margin-bottom: 10px; } th { font-size: 12px; text-align: left; } form { margin: 0px; } input, textarea, select, optgroup, option { font-family: Verdana, sans-serif; font-size: 10px; } button { font-family: Verdana, sans-serif; font-size: 10px; font-weight: bold; text-transform: uppercase; background-color: #000; color: white; } pre { font-family: "Courier New"; font-size: 12px; text-align: left; } .err { color: red; font-weight: bold; margin-bottom: 5px; } .imp { color: #CC3300; font-weight: bold; margin-bottom: 5px; } .msg { color: green; margin-bottom: 5px; } .marker { color: red; font-weight: bold; } .hint { font-size: 10px; font-style: italic; color: gray; } #header { padding: 10px; } #logo { font-size: 14px; font-weight: bold; } #logo a { color: black; text-decoration: none; } #logo a:hover { color: #DF971E; text-decoration: none; } #today { font-size: 10px; } #nav { text-align: right; } #city { font-weight: bold; font-size: 14px; display: block; } #sidebar_left { padding-top: 10px; background-color: #FF6; /*#F0F4FB*/ } .buttons td { text-align: center; background-color: #FF6; } .buttons a { display: block; font-weight: bold; text-transform: uppercase; color: white; padding: 3px; } #sidebar_left .head { font-size: 10px; font-weight: bold; text-transform: uppercase; color: #003366; } #sidebar_left table.linkbox { margin-bottom: 15px; } #sidebar_left table.linkbox a { display: block; text-align: center; padding: 3px; border-bottom: 1px solid #DDDDDD; } table.sidebox { margin-bottom: 10px; } table.sidebox td { text-align: left; } #contentcell { } #content { padding: 10px; } #path { background-color: #FF6; font-size: 16px; margin-bottom: 5px; } #path td { padding: 5px 5px 5px 10px; } #path a { color: #777777; text-decoration: none; } #path a:hover { color: black; text-decoration: underline; } table.searchbox { background-color: #FF6; border: 1px solid #DDDDDD; margin-bottom: 20px; } table.searchbox td { padding: 10px; } .eventnav { border-bottom: 1px solid #DDDDDD; margin-bottom: 10px; } table.dir { } table.dir_cat { } table.dir_cat th { font-size: 14px; font-weight: bold; text-align: left; text-transform: none; margin: 0px; padding-bottom: 5px; } table.dir_cat td { } table.dir_cat .count { color: #999999; font-size: 10px; } table.dir_cat th .count { color: gray; font-size: 10px; } table.adlisting { } table.adlisting tr.ad1 { background-color: #FF6 /*#FAFAFA;*/ } table.adlisting tr.ad2 { } table.adlisting td { padding: 4px; } table.adlisting td.head, table.adlisting tr.head td { font-weight: bold; background-color: #FF6; } table.adlisting td.datehead { background-color: #FF6; /*border-bottom: 1px solid #CCCCCC;*/ font-weight: bold; border-bottom: 0px; } table.adlisting td.icon { } table.adlisting td.icon img { } table.adlisting .adtitle { font-weight: bold; } table.adlisting .date { font-style: italic; } table.adlisting .ad1 { } table.adlisting .ad2 { background-color: #FF6 /*#FAFAFA;*/ } .adheader { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #E0E0E0; } .adheader .icon { /*vertical-align: top;*/ } .adheader .adtitle { font-size: 14px; font-weight: bold; margin-top: 0px; padding-top: 0px; margin-bottom: 0px; padding-bottom: 0px; } .adheader .adarea { font-size: 11px; font-weight: normal; } .ad { margin-bottom: 10px; } .ad .link_marker { color: darkorange; font-weight: bold; } .disclosures { padding: 5px; } .disclosure_yes { color: green; } .disclosure_no { color: red; } .disclosures b { } .adpics { margin-bottom: 10px; /*border-bottom: 1px solid #DDDDDD;*/ } .adpics img { border: 1px solid black; /*padding: 10px; background-color: #FAFAFA;*/ } .imglisting { } .imgitem { margin-bottom: 30px; } .imgitem .head { font-size: 12px; font-weight: bold; } .imgitem img.img { margin-top: 5px; border: 1px solid black; } .imgitem .caption { } .imgitem .poster { font-weight: bold; } .imgitem .time { font-weight: bold; } .imgitem .desc { margin-top: 5px; } .linkbox2 { background-color: #FF6; font-weight: bold; text-transform: uppercase; padding: 5px; text-align: center; color: white; } .linkbox2 a { display: block; color: white; } .linkbox2 a:hover { color: white; text-align: center; } .imagecredits { padding: 5px; } .head { font-weight: bold; } .imagecredits a { } .imagecredits .count { color: #BBBBBB; font-size: 10px; } .comments { } .comments .head { font-size: 12px; font-weight: bold; } .commentitem { margin-bottom: 10px; } .commentitem .poster { font-weight: bold; display: block; } .commentitem .time { color: gray; display: block; } .commentitem .comments { display: block; } #sidebar_right_cities { background-color: #FF6; padding: 0px 5px 5px 5px; } #sidebar_right { padding: 5px 5px 5px 5px; } #sidebar_right a { } .citylist_country { display: block; color: black; font-weight: bold; text-transform: uppercase; font-size: 10px; margin-top: 2px; } .citylist_city { color: #777777; font-size: 10px; } #footer { color: #A0A0A0; } #footer td { font-size: 9px; padding-left: 15px; padding-top: 10px; } table.postad { } img.thumb { border: 1px solid black; } .postpath { padding: 5px; border: 1px solid #DBC06F; background-color: #F7F0DD; font-size: 12px; color: brown; margin-bottom: 10px; } .postpath b { color: black; } .postpath a { font-weight: bold; color: #003399; font-size: 11px; } #search_top { margin-bottom: 20px; padding: 10px; background-color: #FAFAFA; border: 1px solid #EAEAEA; } .invoice { background-color: #F0F0F0; border-right: 1px solid #EAEAEA; border-top: 1px solid #EAEAEA; } .invoice td { background-color: white; padding: 5px; border-left: 1px solid #EAEAEA; border-bottom: 1px solid #EAEAEA; } .invoice .empty { background-color: white; border: 1px solid white; } .invoice .firstcell { font-weight: bold; } .invoice .maincell { /*background-color: #FAFAFA;*/ text-align: right; } .invoice .totalrow td { background-color: #FAFAFA; } .invoice .totalrow .totalcell { background-color: #F3F3F3; font-size: 13px; font-weight: bold; text-align: right; } .featuredad_first, .featuredad_first td { background-color: #FFEEC6; border-top: 1px solid #FFDF95; border-bottom: 1px solid #FFDF95; padding: 5px 5px 2px 5px; margin-bottom: 10px; } .featuredad, .featuredad td { background-color: #FFEEC6; border-bottom: 1px solid #FFDF95; padding: 5px 5px 2px 5px; margin-bottom: 10px; } .featuredad a, .featuredad_first a { font-weight: bold; } .post_note { color: green; } .latestads { padding-top: 10px; margin-bottom: 10px; } .latestads .head { padding-bottom: 5px; color: steelblue; font-size: 12px; } .latestads td { border-top: 1px solid #F0F0F0; } .adcat { font-size: 9px; color: #444444; /*text-decoration: underline;*/ } table.latestads_table td { padding: 1px; } table.latestads_table a.featured { font-weight: bold;; } .catlist .cat { padding: 1px; display: block; } .catlist .cat a { font-weight: bold; } .catlist .subcat { padding: 1px; display: block; } .catlist .count { color: gray; } .adpreview { display: block; font-size: 10px; color: gray; } ********************************************************* Quote Link to comment https://forums.phpfreaks.com/topic/160638-css-issue/ Share on other sites More sharing options...
Hybride Posted June 2, 2009 Share Posted June 2, 2009 First, please use the code feature next time you post code, it makes the code much easier to see and manage. Second, if you build with CSS, stick with CSS. Don't use tables for layouts, that's what CSS is for (among other things). Third, your question, if am understanding correctly, would be: imgitem img.img { margin-top: 5px; border: 1px solid black; } Change that to imgitem img.img { margin-top: 5px; border: 0; } so the imgitem img.img has no border. You can also use img{border:0} to set no borders for every image on every page on the entire site. Quote Link to comment https://forums.phpfreaks.com/topic/160638-css-issue/#findComment-847908 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.