Board index PBase HTML and Style Sheets Modified Webdev Stylesheet

HTML and Style Sheets

Modified Webdev Stylesheet

Customize your galleries.
topfuelhd
 
Posts: 27

Modified Webdev Stylesheet

Post Thu Aug 14, 2003 2:19 pm


I really like the new Webdev Stylesheet. But there was a couple of things I would liked changed. For example, thumbnail image did not fade out and some text was to dark to see. So without any knowledge of code and really not knowing what I was doing, I managed (I think) to change these things in my stylesheet.

Check it out and tell me what you think.

http://WWW.Pbase.com/TopFuelHD

offroads
 
Posts: 7


Post Thu Aug 14, 2003 7:44 pm


looks great! can you post the code?

mikelly
 
Posts: 38


Post Fri Aug 22, 2003 10:22 pm


:( I've been trying to modify the Webdev Stylesheet so that it works with Mozilla Firebird and Opera like it does with MSIE. Frustration has begun to take hold and I am about to surrender! :shock:

The features that I am trying to implement include the table cell that surrounds the thumbnail and still retain its ability to recognize the hover feature. So far, it works with MSIE, but not with Firebird or Opera.

Question: Does anyone know if these browsers recognize the hover feature?

My second chore is to get the other browsers to CENTER the image title and location. Again, MSIE is able to do this.

Please take a look at my site and see if it looks OK to you. The main gallery and What's New are using the modified styles.

http://www.pbase.com/mikelly

MSIE seems to be much more forgiving of sloppy coding... :oops:

Thanks,

Mike Kelly
Houston, Texas

srijith
Moderator
 
Posts: 2321
Location: Amsterdam


Post Sat Aug 23, 2003 2:03 am


mikelly wrote:Question: Does anyone know if these browsers recognize the hover feature?

My second chore is to get the other browsers to CENTER the image title and location. Again, MSIE is able to do this.


As for the hover, if I am not wrong, it work only on links.

AS for centering maybe this will help?
Code: Select all
/*To center the Title of the image */
h3.title {
text-align:center;
}

/*To center the Caption of the image*/
p.caption {
text-align:center;
}

/*To center the Location of the image*/
h3.location {
text-align:center;
}


I am not in a position to test whether these works :) So, do drop a line if it does!

mikelly
 
Posts: 38

Centering and hovering...

Post Sat Aug 23, 2003 3:54 pm


Sorry, this code did not center the text for Mozilla Firebird and Opera. Those browsers appear to "center" the text between the left margin and the center of the page (with or without the following code). MSIE displays perfectly (with or without the following code).

===========================
/*To center the Title of the image */
h3.title {
text-align:center;
}

/*To center the Caption of the image*/
p.caption {
text-align:center;
}

/*To center the Location of the image*/
h3.location {
text-align:center;
}
======================

Hover over links: MSIE displays a rectangle around the thumbnail image. When the cursor 'hovers' over a thumbnail, the whole rectangle, including the border, changes like it is designed to do. The entire rectangle is linked to the image. No problem.

Neither Mozilla Firebird 0.6.1 or Opera 7.11 show the rectangle that is supposed to include the thumbnail and its title. Nothing changes when 'hovering' occurs. The thumbnail link does work.

GOAL: to have the other browsers display and function the same as MSIE 6.0. I like the surrounding rectangles and the linking capability...

------------------------------------------
FYI: I removed the MSIE specific code from my modifications to the webdev code. (graduated colors & opacity)


Thanks again,

Mike Kelly
Houston, Texas

mikelly
 
Posts: 38

Centering issue appears to be resolved

Post Sat Aug 23, 2003 7:00 pm


The left justified text for the image title and location was a real mystery because it only displayed that way in Mozilla Firebird and Opera. MSIE was center justified just as it should have been.

I changed the following width code for H3.

H3
(note: there is more H3 code in my stylesheet-I am not showing it here.)
width: 100%;
/* width: 400px; */

The 400px width was causing the problem. DISCLAIMER: It does appear to work properly in all 3 browsers, but I have not tested it thoroughly. Don't blame me if it doesn't work for others.... 8)

http://www.pbase.com/mikelly

Mike Kelly
Houston, Texas


Board index PBase HTML and Style Sheets Modified Webdev Stylesheet

Who is online

Users browsing this forum: No registered users and 3 guests