Why is black showing on thumbnails background?

Take a look:

http://photos.sirstevesguide.com/sho...y.php?cat=3066

They are doing it on all the thumbnails and I don't know why...

[Chuck S]

Thats the default background as the image thumbs are made as a background but scaled to height width scaled to fit. You can set this to match you style by changing the bgcolor of #000000 to match your style in thumbnail-round.tmpl

ok but why did this all of a sudden start?

[Michael P]

Well, as you know a "sudden" change would require that something changed. Code doesn't just decide to start acting differently on its own; so maybe you changed your stylesheet or templates?

right but I never changed this: thumbnail-round.tmpl file so I was wondering where at in the stylesheet this may have gotten changed as I cannot seem to find it.

[Chuck S]

No one is saying you changed anything.

I am saying the default coding shows a black background if your thumb is not perfect dimension of the overlay. Remember the overlay is a set size so your thumb background is variable in proportion to the image size. it fits in proportion to that overlay which means some of the background shows on certain thumbs

If you want to change the background color you can.

which one do I change to get back the thin 1 pixel black border?

A:link, A:visited, A:active, A:hover {
}
A:link {
color: #660000;
}
A:visited {
color: #660000;
}
A:active {
color: #660000;
}
A:HOVER {
color: #C04E00;
background-color: ;
}

.onbody {
color: #000000;
}
.onbody A:link {
color: #000000;
}
.onbody A:visited {
color: #000000;
}
.onbody A:active {
color: #000000;
}
.onbody A:hover {
color: #C04E00;
}

BODY,P,TABLE,TD,TR {
font-size: 9pt;
color: #000000;
font-family: Verdana, Helvetica, sans-serif;
margin-top: 0px;
margin-left: 3px;
margin-right: 3px;
margin-bottom: 0px;
}
BODY {
background: #FFFFFF;
}
FORM {
display: inline;
margin-bottom: 0;
}
PRE {
font-size: ;
font-family: ;
}

.tableborders {
background: #B4B4B4;
}

.tddetails {
background: #FFFFFF;
}

.tdbackground {
font-size: 9pt;
font-weight: ;
color: #000000;
background: #F0EDED;
font-family: Verdana, Helvetica, sans-serif;
}

.tdnothumbs {
font-size: 9pt;
font-weight: ;
color: #000000;
background: #F0EDED;
font-family: Verdana, Helvetica, sans-serif;
}

.menubar{
background: #660000;
font-size: 8pt;
color: #FFFFFF;
}
.menubar A:link {
color: #FFFFFF;
}
.menubar A:visited {
color: #FFFFFF;
}
.menubar A:active {
color: #FFFFFF;
}
.menubar A:hover {
color: #FFFFFF;
}

.menubarnb{
background: #660000;
font-size: 8pt;
color: #FFFFFF;
}
.menubarnb A:link {
color: #FFFFFF;
}
.menubarnb A:visited {
color: #FFFFFF;
}
.menubarnb A:active {
color: #FFFFFF;
}
.menubarnb A:hover {
color: #FFFFFF;
}

.catcolumn {
font-size: 8pt;
font-style: ;
text-align: ;
background: #F0EDED;
}

.photocol {
font-size: 8pt;
font-style: ;
text-align: ;
background: #D8BEBE;
}

.commentscol {
font-size: 8pt;
font-style: ;
text-align: ;
background: #F0EDED;
}

.lastphocol {
font-size: 8pt;
font-style: ;
text-align: ;
background: #F0EDED;
}

.lastcommcol {
font-size: 8pt;
background: #D8BEBE;
color: ;
}

.small {
font-size: 8pt;
font-family: Verdana, Helvetica, sans-serif;
}
.medium {
font-size: 10pt;
font-family: Verdana, Helvetica, sans-serif;
}
.large {
font-size: 12pt;
font-family: Verdana, Helvetica, sans-serif;
}

.welcome {
background: ;
font-family: Verdana, Helvetica, sans-serif;
color: #FFFFFF;
}

.#F0EDEDtable {
background: #F7F7F7;
color: #000000;
}

.alternatetable {
background: #DEDEDE;
}

.formboxes{
font-family: ;
background-color: ;
color: ;
font-size: 9pt;
}

blockquote {
font-size:9pt; border:1px solid #E6E6E6;
margin:0px 20px; padding:0px 10px
}
blockquote .small {
background:#E6E6E6;
margin-left:-10px; padding:1px 2px
}
blockquote hr {
visibility:hidden;
height:1px
}
blockquote br {
font-size:1px
}

[Chuck S]

No Steve

If you edited the templates you need to reedit the templates not the styles

As Michael stated what did you change? Something just all of a sudden does not change. In this thread you asked how to change the black background of the round template cause you did not like it.

If your talking about the regular thumbnail template border in layout options in admin section you can specify the border color.

I have not edited any templates. The only thing that has been edited is the header.html and stylesheets.

What I am asking is how to get the thin 1 pixel black border back.

The admin is set:

Pixel size of borders for images/thumbnails
Thickness - set to 0 for no border
1

Color for image borders
Color of the frame around images/thumbs
#000000

Select a border for your thumbnails
Choose from the available borders for your thumbnails
thumbnail

[Chuck S]

That would only be used on the regular thumbnail template not the custom ones and thats not what this thread was originally about.

I think one of us is confused and it may be me but I would like to know how to fix the black background images that is displayed on on the showgallery pages like this one:
http://photos.sirstevesguide.com/sho...y.php?cat=3066

As I stated before, I have not edited any templates.

[Chuck S]

I beleive I answered this above. There is nothing to fix. That would be the coding of that overlay template as I noted above. Your photo is shown in proportion to the overlay image which means if your thumb can not cover the whole overlay than the background is shown hense black

Therefore as such in the thumbnail-round.tmpl there is this

Content visible to verified customers only.

You can change that background color to white in your case to not show that black

What I don't understand is how this is happening "all of a sudden". I would have noticed this before. ALL the pictures are doing it:

http://photos.sirstevesguide.com/sho...y.php?cat=1921
http://photos.sirstevesguide.com/sho...y.php?cat=2192
http://photos.sirstevesguide.com/sho...y.php?cat=1922
http://photos.sirstevesguide.com/sho...at=1922&page=1

[Chuck S]

The thumbnail round template has always had a black background

Thats how Michael coded it. basically the overlay template is a certain size. The background image is show in proportion to that overlay meaning any top or side space not covered by the background will be the base background which is black. Say you have a thumbnail thats 75 pixels wide and the overlay is 80 pixels wide. Now do you get it?

Nothing has changed. maybe you just now started using the thumbnail round template instead of the default template which does not have overlays. You can always switch back to a regular thumbnail template if you dont like the round. We have like 14 different template styles

Originally Posted by omegatron

The thumbnail round template has always had a black background

Thats how Michael coded it. basically the overlay template is a certain size. The background image is show in proportion to that overlay meaning any top or side space not covered by the background will be the base background which is black. Say you have a thumbnail thats 75 pixels wide and the overlay is 80 pixels wide. Now do you get it?

Nothing has changed. maybe you just now started using the thumbnail round template instead of the default template which does not have overlays. You can always switch back to a regular thumbnail template if you dont like the round. We have like 14 different template styles

I get it. It is (has always been) set to "thumbnail". I have never changed it to "thumbnail-round" or anything else. This is my point. I have not change anything but the style sheet and header.html. No template, no settings.

[Chuck S]

Why is your site not remapping the tddetails style I would ask. That to me looks strange as tddetails is a normal style used

<table cellpadding="{$Globals['cellpadding']}" cellspacing="0" border="0" bgcolor="{$Globals['framecolor']}">
<tr>
<td>
<table width="100%" cellpadding="0" cellspacing="0" border="0" class="{$Style['tddetails']}">


That is probally what is giving you more black border

Originally Posted by omegatron

Why is your site not remapping the tddetails style I would ask. That to me looks strange as tddetails is a normal style used

<table cellpadding="{$Globals['cellpadding']}" cellspacing="0" border="0" bgcolor="{$Globals['framecolor']}">
<tr>
<td>
<table width="100%" cellpadding="0" cellspacing="0" border="0" class="{$Style['tddetails']}">


That is probally what is giving you more black border

I would ask that if I knew what the problem was.

That may be giving me the "more" black border but the question still remains... how do I fix it?

I found it. This was in the wrong place in the style sheet.

margin-top: 0px;
margin-left: 3px;
margin-right: 3px;
margin-bottom: 0px;

[Chuck S]

So you added a margin statement into your style that would do it.

Remember we only have the default code to look at when giving advice. Hense Michael and I asking whats did you change in your style