The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Picture alignment help for Newbe, I need some basic advice on alignment of a small image.
Corporate id
post Oct 22 2008, 01:06 AM
Post #1





Group: Members
Posts: 2
Joined: 22-October 08
Member No.: 6,955



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
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Oct 22 2008, 02:24 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



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.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Corporate id
post Oct 22 2008, 10:26 PM
Post #3





Group: Members
Posts: 2
Joined: 22-October 08
Member No.: 6,955



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
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Oct 23 2008, 02:38 AM
Post #4


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



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>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 26th April 2024 - 01:16 AM