...

View Full Version : Css Issue - See www.flog-it.ie



irishpeck
06-02-2009, 03:01 PM
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;
}

*********************************************************

Rowsdower!
06-02-2009, 03:17 PM
Hello and welcome to the forums!

First off, please edit your first post to use
][/C[/COLOR]ODE] tags around your code block. This makes things much easier to read.

Now to remove borders from your images all you have to do is this:[CODE]img {
border:0;
}

It's generally a good idea to start out your css with this at the very top anyway, which would have also taken care of the problem:
* {border:0;margin:0;padding:0;}

And one more tip from the peanut gallery: If you are building/testing/debugging with Internet Explorer then switch to Firefox immediately for site construction. The rule of thumb is that you always design, test, and debug using FF, then tweak/hack for IE. If you do it the other way around you end up with messy code and a lot of headaches.

irishpeck
06-02-2009, 03:27 PM
Thank you so much very helpful



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum