New style sheets soon?

[areid]

Anyone working on a new style sheet to debut soon?


Allen


http://www.pbase.com/areid

[pstewart]

Mine is relatively new...just made it last month. See what you think.
http://www.pbase.com/pstewart/galleries

I like it better on IE than on Netscape since you can see boxes around the pics in IE but not in Netscape...same for the gold frames on rollover. It's based on the webdev style without the opacity change and different colors and different border settings etc.

Some folks tell me that the captions are off-center on certain browsers, but I've never been able to see what they mean. I know the title bar under the image comes from the left, and isn't centered, but I like that look better than centered. However, this may not be what folks are talking about. So, if you notice something that's "not right" and can explain it better, please let me know. Thanks.

[mikelly]

Phyllis, I have looked at your site with Netscape 7, Opera 7, Firebird .6, and MSIE 6. MSIE 6 is the only browser that is showing the box around the thumbnails,

I modified the WebDev stylesheet so that it would show the boxes for all of these browsers. Other than my color scheme and border widths, it seems to display the way that you want (if I read your post correctly).

Take a look at the page source for my site and see if you can use any of the changes that I made.

http://www.pbase.com/mikelly

Mike Kelly

[pstewart]

Thanks, Mike. It's all Greek to me...not very knowledgeable about source code. Might take a while with comparisons to see just what html is different so that browsers other than IE can see the boxes. Do you know off hand which lines I should be looking at?

[mikelly]

Try pasting this code into a new style and start making changes to the colors so that you can see the results. I am very new to this and I made these changes in August. My memory is suspect on the changes that I made, but I do remember that there was a lot of 'trial and error' involved. Remember: the /* */ enclose comments.


Just insert your colors and border widths one at a time and look at the results. The horizontal at the top was done in the H1 line.

Mike

Code: Select all

/*
   :::::::::::::::StyleSheet Information :::::::::::::::
   :: ----------------------------------------------- ::
   :: PBase.com Style Version 1.1                     ::
   :: by Webdev - Pim Rijpsma - NL                    ::
   :: http://www.pbase.com/webdev/                    ::
   :: License Terms : Attribution-ShareAlike 1.0      ::
   :: http://creativecommons.org/licenses/by-sa/1.0/  ::
   :: ----------------------------------------------- ::
   :: Basic modifications by Mike Kelly, 30Aug03      ::
   :::::::::::::::::::::::::::::::::::::::::::::::::::::
*/

a,
a:link,
a:visited,
a:active
{
   color: yellow;
   background: navy;
   text-decoration: none;
   
}

a:hover
{
   color: red;
   background: navy;
   text-decoration: none;
}

a.thumbnail,
a.thumbnail:link,
a.thumbnail:visited,
a.thumbnail:active
{
   border: silver 5px inset;
   margin-bottom: -34px;
   padding-top: 12px;
   display: block;
   color: yellow;
   
   background: blue;
   width: 185px;
   height: 190px;
/*   -moz-opacity:0.80;
   filter: Alpha(Opacity=80);  */
}

a.thumbnail:hover
{
   border: red 5px inset;
   margin-bottom: -34px;
   padding-top: 12px;
   display: block;
   color: yellow;
   font-weight: bold;
   background: navy;
   width: 185px;
   height: 190px;
/*   -moz-opacity:1.0;
   filter: Alpha(Opacity=100); */
}

body
{
   margin-bottom: 20px;
   margin-top: 0px;
   background: navy;
}

div,
body,
th,
tr,
table,
li,
ul,
form,
blockquote,
p,
b,
i,
h4,
center
{
   border: 0px;
   color: yellow;
   font: 12px Verdana, Arial, Helvetica, sans-serif;
}

font
{
   border: 0px;
   margin-left: 4px;
   margin-right: 4px;
   font: 12px Comic Sans MS, Verdana, Arial, Helvetica, sans-serif;   
   letter-spacing: 0px;
}

h1, h2
{
   border-bottom: yellow 3px ridge;
   border-left: 1px none;
   border-right: 1px none;
   border-top: black 1px solid;
   margin-bottom: 1em;
   margin-left: -10px;
   margin-right: 0px;
   padding-left: 25px;
   width: 100%;
   display: block;
   background: blue;
   color: Yellow;
   font: bolder 20px comic sans ms, Verdana, Arial, Helvetica, sans-serif;
   letter-spacing: 4px;
   text-align: left;
   position: relative;
   /* filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1,enabled='true',startColorstr='blue',endColorstr='navy');
*/ }

h3
{
   border-bottom: yellow 2px ridge;
   border-left: 1px none;
   border-right: 1px none;
   border-top: 1px none;
   padding: 2px;
   width: 100%;
   display: block;
   background: navy;
   color: yellow;
   font: normal 12px Comic Sans MS, Verdana, Arial, Helvetica, sans-serif;
   letter-spacing: 0px;
   text-align: center;
}


h5
{
   border: 0px;
   padding-left: 2px;
   width: 150px;
   display: block;
   color: yellow;
   font: normal 12px Comic Sans MS, Verdana, Arial, Helvetica, sans-serif;
  /* filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1,enabled='true',startColorstr='blue',endColorstr='navy');
*/
}

img
{
   border: black 1px none;
}

img.thumbnail
{
   border: silver 4px inset;
   margin: 0px;
   padding: 0px;
   background: navy;
   color: yellow;
   font-weight: bold;
   vertical-align: middle;
}

input
{
   border: rgb(0, 0, 0) 1px solid;
}

table.thumbnail
{
   width: 10%;
}

td
{
   border: 1px none;
   background: none;
   border-collapse: collapse;
   empty-cells: show;
}

td.message_body
{
   border-bottom: yellow 1px solid;
   border-left: 1px none;
   border-right: 1px none;
   border-top: 1px none;
   display: block;
   background: navy;
   color: yellow;
}

.caption
{
   color: yellow;
   font-size: 12px Comic Sans MS, Verdana, Tahoma, Helvetica, sans-serif;
   font-style: italic;
}

.display
{
   border: silver 5px inset;
   margin-top: 1em;
   background: blue;
   color: yellow;
   /* filter:Shadow(color="yellow",Direction=135,Strength=5); */
}

.lid
{
   border: black 1px solid;
   background: silver;
   color: navy;
   font: 12px Comic Sans MS, Verdana, Tahoma, Helvetica, sans-serif;
   text-decoration: none;
   text-align: left;
   empty-cells: show;
   font-weight: bold;
   padding-left: 10px;
}

.message_body
{
   margin: 5px 5px 10px;
   color: yellow;
   background: navy;
   font: 12px Comic Sans MS, Verdana, Tahoma, Helvetica, sans-serif;
}

.sb
{
   border-top: black 1px solid;
   border-right: black 1px solid;
   border-bottom: black 1px solid;
   border-left: black 1px solid;
   background: Silver;
   color: Navy;
   font: 12px Comic Sans MS, Verdana, Tahoma, Helvetica, sans-serif;
   text-decoration: none;
   text-align: center;
   font-weight: bold;
}