Fitting the canvas to an oval object?

[ethanf81254644]

Here is my problem: I have an oval button that I am trying to use in a website. When the user hovers over the button it will display a shadow underneath. The problem is that with an oval button on a rectangular canvas, the shadow hovers under the canvas, not the image. Is there a way to crop or fit the canvas to the image exactly?

[WILDCAT54]

please share a screen shot of your document and layers panel.

Your original question is sort of confusing.

ethanf81254644  wrote

the shadow hovers under the canvas, not the image. Is there a way to crop or fit the canvas to the image exactly?

What are you referring to as a the canvas? Assuming you are referring to your oval button as the "image"?

[Manuhart]

ethanf81254644  schrieb

Is there a way to crop or fit the canvas to the image exactly?

If you are working with opacity, you can use Image>Trim

[WILDCAT54]

Ether way, I would recommend doing this all in CSS

<style>

Oval-Button

{

width: 244px;

height: 84px;

-webkit-border-radius: 122px/42px;

-moz-border-radius: 122px/42px;

border-radius: 122px/42px;

background-color: #ac8f41;

}

.Oval-Button:hover {

  box-shadow: 0 0 11px rgba(33,33,33,.2);

}

</style>

[davescm · Accepted solution]

The canvas in Photoshop is always a rectangle. Even with trim it will trim the rectangle to fit the image pixels.  You can of course have transparency on the canvas provided you save the image to a file format that supports transparency (such as PNG)

Dave