Help - Search - Members - Calendar
Full Version: Picture alignment help for Newbe
HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)
Corporate id
Hi Guys! Its great to be a part of your forum.

Guys I am quite new at HTML and have been progressing along with dreamweaver for a little time creating some code to put in a description box that is in the back end of my up and coming site.

The issue I am having is there is a little magnifying glass after the text link "view hi res image" which is attached to a flash upsize, that I would like to be next to the "view hi res image " text instead of across the page. Is there something I need to add/remove from the code to get this to happen?

Site page http://demo86.xlswebstore.com/index.php?c=...p;product=6ATHS


Thanks guys I appreciate it.

KR
Brendan
Frederiek
You have used float: right; on the DIV that contains the magnifying glass as background-image.
Don't float it. Only then, it is pushed underneath the text link.
You simply could put the image in an <img> tag next to the link text, instead of using a background-image.
Corporate id
Hi Frederiek, Thanks for post.

I had a play with the code and cant seem to get it where I would like it. I have now just changed

<p><a href=/images/hires_images/jbs/6athsen-highres.jpg title=Hi_res_image rel=lightbox>View Hi Res image <div class=zoom></div> </a></p>

to

<p><a href=/images/hires_images/jbs/6athsen-highres.jpg title=Hi_res_image rel=lightbox>View Hi Res image</a></p>

and it just shows the text and the link works. I wont worry about the magnifying glass. I hope this code is ok for all browsers as I am about to use it as a template for all of our store products.

Thanks for your help Frederiek
Frederiek
Oh well, a magnifying glass would have been a nice touch, though the link text says enough.

Anyway, you could have donesomething like this:
<p><a href="/images/hires_images/jbs/6athsen-highres.jpg" title="Hi_res_image" rel="lightbox">View Hi Res image <img src="imagename.xxx" ...></a></p>
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2010 Invision Power Services, Inc.