Solved

CSS how to scale image to 50px by 50px

Posted on 2011-09-08
6
480 Views
Last Modified: 2012-05-12
Please can someone advise how I should modify the below css to scale my image down to 50px by 50px. the reason we don't want to use a 50px by 50px native image is so we can preserve the quality of the image edge for transparency to be effective.

	.mstrLogo {
		background: 		transparent url(images/project.gif) no-repeat scroll center;
	}
	A.mstrLink:hover .mstrLogo {
		background-image: 		url(images/project.gif);
	}
	* HTML .mstrLogo {
		filter: 		progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../plugins/ReplacingMicroStrategyWebButton/style/images/project.gif', sizingMethod='scale');
	}
	* HTML A.mstrLink:hover .mstrLogo {
		filter: 		progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../plugins/ReplacingMicroStrategyWebButton/style/images/project.gif', sizingMethod='scale');
	}

Open in new window

0
Comment
Question by:regnighc
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
6 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 36503365
why not simply mention the height and width as 50px?
0
 
LVL 2

Author Comment

by:regnighc
ID: 36503506
Sorry I cant work out how todo that First time ive played with css this is a premade file
0
 
LVL 13

Expert Comment

by:haloexpertsexchange
ID: 36503558
is this a background image that you want sized?
if so then look at this link http://stackoverflow.com/questions/1341358/set-size-on-backgroundimage-with-css
You can size a background image for browsers that are css3 compliant with the background-size but that does not work with most browsers so your best bet would be just to re-size the image before use.
Otherwise there is the normal width and height that you can set with css to size anything else.
0
 
LVL 44

Accepted Solution

by:
scrathcyboy earned 500 total points
ID: 36514798
<IMG src="mythumb.jpg" width="50 px" height="50 px">  that is the HTML
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 37343905
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
HTML editor custom button 3 88
Increase image taller on inner pages 2 51
CSS Formatting Getting Stripped 1 35
My tooltip is not displaying correct 11 16
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

738 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question