border padding problem

ZeptOr

New Member
Messages
442
Reaction score
0
Points
0
On a specific page of my website, I have a couple of thumbnails pictures that I want a padded border around. My CSS seems to work fine in Firefox, but not in IE. The URL is here:

http://www.alexthegood.com/main/digital.html

My CSS that i used to put the padded border is this:

Code:
img.frame
	  {
		border: 1px #406B7C solid;
		padding:4px;
		}

	  img.frame:hover
	  {
		border: 1px #406B7C solid;
		padding:4px;
                }

and if you want to see my other CSS, although its messy, its here:

http://www.alexthegood.com/main/atgStyles.css
 
Last edited:

Zenax

Active Member
Messages
1,377
Reaction score
4
Points
38
I really think that you don't need the img.frame:hover CSS.

Try Removing it and see what happens!

Regards,
Zenax
 

Cubeform

New Member
Messages
339
Reaction score
0
Points
0
Instead of styling the <img /> elements, you style the <a /> elements that contain them. In order to not screw up the rest of your website, you'll need to apply a class to the <a /> elements.

Code:
a.frame
	  {
		border: 1px #406B7C solid;
		padding:4px;
                display:block;
          }

a.frame:hover
	  {
		border: 1px #406B7C solid;
		padding:4px;
          }

Note the display:block attribute that needs to be applied.

It works in Firefox.
 
Last edited:

ZeptOr

New Member
Messages
442
Reaction score
0
Points
0
Thanks cubeform, that seemed to work

btw, what program are you using in that picture?
 

dest581

New Member
Messages
348
Reaction score
0
Points
0
The Web Developer toolbar HTML editor, it looks like. It's an extension for Firefox.

Lets you edit an already existing HTML page, so you can see how changes would affect it immediately.
 

ZeptOr

New Member
Messages
442
Reaction score
0
Points
0
where do you download that? it sounds more useful than notebook
 
Top