CSS Thumbnails and headers overlaping. Float Issue? [VIDEO LINK]

[drhowarddrfine]

Yes, but how would you use it? Do you mean a thumbnail that expands on hover or something to click on to expand or what? Some can be done with CSS, some with javascript.

[GloStix]

Yes, but how would you use it? Do you mean a thumbnail that expands on hover or something to click on to expand or what? Some can be done with CSS, some with javascript.

No no, nothing fancy. If you look at my thumbnails you'll see that they're stretched versions of the original pictures that they link to. I'm just asking for something that would show the preview of that image but scaled version so it's not stretched like replace empty space with just white... Because I don't exactly want to make a seperate scaled thumbnail version of each image I put up. maybe like a script that takes the link of the original image and displays it scaled to the dimensions.

I don't know if that's possible =\
I'm no master at this stuff.

[drhowarddrfine]

The sizes of the images are fixed in your html attributes for those images. If you look at the <img> tags, inside there is a height and width set. Changing that will change the sizes but they will be fixed at whatever you set them to.

Those sizes can be, and are supposed to be, in your CSS. If they are in CSS, then little tricks with hovering can be done. Otherwise, the only way to change the values is with javascript or by hand.

If you want to use javascript, you need to ask on that board.

[GloStix]

The sizes of the images are fixed in your html attributes for those images. If you look at the <img> tags, inside there is a height and width set. Changing that will change the sizes but they will be fixed at whatever you set them to.

Those sizes can be, and are supposed to be, in your CSS. If they are in CSS, then little tricks with hovering can be done. Otherwise, the only way to change the values is with javascript or by hand.

If you want to use javascript, you need to ask on that board.

Ohhhh Now I get it!
*slaps face*
I'm an idiot xD

I have 1 more quick question related to the thumbnails.
I now have:



I'm trying to get this.



I added this:
*HTML*

<li class="wide"><a href="media/art/HotRikkuSig2.gif" title="Rikku Forum Signature" target="_blank"> <img src="media/art/HotRikkuSig2.gif" alt="Rikku Forum Signature" width="207" height="65" border="0"/><span>Rikku Forum Signature</span></a></li>

and

*CSS*

.wide {
	margin-top:50px;
	text-align:center;
}

Is it even possible? xD
I hate to keep bugging you guys on these little details. But I appreciate very much.

:)

[drhowarddrfine]

See if adding 'vertical-align:baseline' or 'middle' to .wide does it.

[GloStix]

See if adding 'vertical-align:baseline' or 'middle' to .wide does it.

Nope, unfortunately either of them don't work :(
I never knew about the vertical-alignment thing though.
Learnt something anyway :)

[GloStix]

Meh oh well, I just put some </br> 's before the image and it made it go down...
Any other way? xD

[GloStix]

I think I need to state a height so the vertical alignment will work,

[GloStix]

hello >.>
I wonder why it's not working =\

[heenakausar]

hi,

apply your wide class to anchor tag as well...
because many a times classes applied outside the anchor tag doesnt get applied...
so try it out...
may be you'll get..

[GloStix]

I don't even have Anchor tags yet... Your telling me to put one for .wide?

or to put it related to the div it's in?

[heenakausar]

I don't even have Anchor tags yet... Your telling me to put one for .wide?

or to put it related to the div it's in?

u have posted this code
am talking about this

*HTML*
Code: ( text )

1.
<li class="wide"><a href="media/art/HotRikkuSig2.gi f" title="Rikku Forum Signature" target="_blank" > <img src="media/art/HotRikkuSig2.gi f" alt="Rikku Forum Signature" width="207" height="65" border="0"/><span>Rikku Forum Signature</span></a></li>



and

*CSS*
Code: ( text )

1.
.wide {
2.
margin-top:50px;
3.
text-align:center;
4.
}




Is it even possible? xD
I hate to keep bugging you guys on these little details. But I appreciate very much.

:)

[GloStix]

Oh I think I know what you mean... You want me to apply the class to the img instead of the list item?