HighDots Forums  

Center images within a photo frame

Macromedia Dreamweaver Macromedia Dreamweaver Discussions (macromedia.dreamweaver)


Discuss Center images within a photo frame in the Macromedia Dreamweaver forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
phrarod
 
Posts: n/a

Default Center images within a photo frame - 09-23-2008 , 12:54 AM






I saw a friend's site where it used a pre-bought package. It had nice photo
frames and a sutle drop shadow.

The site I'm working on has a lot of photos and I would like to set them off
this way.

What I did was make the frame with a drop. Drop shadow isn't looking good even
though I did a .png Anyway, I made the frame the background image-ok. Now I
want to center the photo within the frame. The photo info is in the page as the
owner wants to change it. Its a <img> tag. I tried doing a align center in the
<img> but that didn't do it.

Somehow that program did it. I believe it was done with CSS.

Anyone know?


Reply With Quote
  #2  
Old   
Walt F. Schaefer
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 02:14 AM






Sure. Just buy that same package.

--

Walt


"phrarod" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:
I saw a friend's site where it used a pre-bought package. It had nice photo
frames and a sutle drop shadow.

The site I'm working on has a lot of photos and I would like to set them
off
this way.

What I did was make the frame with a drop. Drop shadow isn't looking good
even
though I did a .png Anyway, I made the frame the background image-ok. Now
I
want to center the photo within the frame. The photo info is in the page
as the
owner wants to change it. Its a <img> tag. I tried doing a align center in
the
img> but that didn't do it.

Somehow that program did it. I believe it was done with CSS.

Anyone know?




Reply With Quote
  #3  
Old   
phrarod
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 02:34 AM



Funny. Its a whole website package. I'm sure I could make just that part. Here's an example:

http://www.vintagemotoring.net/image...um=1&gallery=2


Reply With Quote
  #4  
Old   
Osgood
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 02:34 AM



phrarod wrote:
Quote:
I saw a friend's site where it used a pre-bought package. It had nice photo
frames and a sutle drop shadow.

The site I'm working on has a lot of photos and I would like to set them off
this way.

What I did was make the frame with a drop. Drop shadow isn't looking good even
though I did a .png Anyway, I made the frame the background image-ok. Now I
want to center the photo within the frame. The photo info is in the page as the
owner wants to change it. Its a <img> tag. I tried doing a align center in the
img> but that didn't do it.

Somehow that program did it. I believe it was done with CSS.

Anyone know?

Give us a link to the page where you are trying centre your image or
give us a link to this friends site so we can take a look at the code.
Then we can advise you of how to achieve what it is you want.


Reply With Quote
  #5  
Old   
phrarod
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 03:15 AM



I included the link to the page that does it in the premade site.

Here's where I'm trying to do it. I screwing around with the page so ignore
extraneous code/screwups.

http://hipnoticinc.com/alpha/alpha.r...breeders1.html



Reply With Quote
  #6  
Old   
Osgood
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 04:03 AM



phrarod wrote:
Quote:
I included the link to the page that does it in the premade site.

Here's where I'm trying to do it. I screwing around with the page so ignore
extraneous code/screwups.

http://hipnoticinc.com/alpha/alpha.r...breeders1.html


Ok well yourr going to want those gallery images to be a link at some
stage so first wrap the image in a anchor tag, as below: It's much
easier to go into code view to do this.


<div id= "beardbphoto1"><a href="#"><img src="images/breeder-photo1.jpg"
width="160" height="120" /></a></div>



Next position and style the anchor tag with some css. Add the below to
your css stylesheet:


#beardbphoto1 a {
width: 160px;
height: 120px;
display: block;
border: 6px solid #fff;
}

#beardbphoto1 a:hover {
border: 6px solid #999;
}

a img {
border: none;
}


Now when you mouse over the image you should get a grey border.


Reply With Quote
  #7  
Old   
phrarod
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 04:07 AM



Osgood. Is my link showing up? Here's what I'm working on now. Less complex. I
just want to center the photo within the box I made. I made a div to contain
the photo.

http://hipnoticinc.com/alpha/alpha.r...breeders1.html



Reply With Quote
  #8  
Old   
Osgood
 
Posts: n/a

Default Re: Center images within a photo frame - 09-23-2008 , 04:24 AM



phrarod wrote:
Quote:
Osgood. Is my link showing up? Here's what I'm working on now. Less complex. I
just want to center the photo within the box I made. I made a div to contain
the photo.

http://hipnoticinc.com/alpha/alpha.r...breeders1.html


Sure your link is showing up,

Heres my reply form a previous post:

Ok well youre going to want those gallery images to be a link at some
stage so first wrap the image in a anchor tag, as below: It's much
easier to go into code view to do this.


<div id= "beardbphoto1"><a href="#"><img src="images/breeder-photo1.jpg"
width="160" height="120" /></a></div>



Next position and style the anchor tag with some css. Add the below to
your css stylesheet:


#beardbphoto1 a {
width: 160px;
height: 120px;
display: block;
border: 6px solid #fff;
}

#beardbphoto1 a:hover {
border: 6px solid #999;
}

a img {
border: none;
}


Now when you mouse over the image you should get a grey border.


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.