?
Solved

adding an image to a css template (in dreamweaver)

Posted on 2008-10-12
3
Medium Priority
?
276 Views
Last Modified: 2012-05-05
Hi I am creating a webpage on dreamweaver- just learning some css (opposed to tables) and I am doing my first site and I am having a problem with image positioning.

I downloaded a template and thats how I got the basic page design set up (didnt create it all myself)

I would like to have text on the left hand side, and an image on the right hand side.

Would I do this by setting a position on the image? Or would I do that another way?

Here is an image of what I have now-  http://cellprophones.com/contact
I want to have the text on the left, and the image on the direct opposite side  (basically the opposite of what I have now). Any info is appreciated.
0
Comment
Question by:kate_nelson2001
3 Comments
 
LVL 6

Accepted Solution

by:
gxp071 earned 1000 total points
ID: 22701099
you need to add  the following css to your image either directly or in a style sheet using a class or id.

e.g.

style="float:right"

<img width="132" height="150" align="right" src="happy_phone.jpg"  style="float:right" />

you may also want to checkout http://www.w3schools.com/ great tutorials on CSS, HTML and everything related for beginners.
0
 
LVL 25

Assisted Solution

by:Rouchie
Rouchie earned 1000 total points
ID: 22709388
Another way is to put the text in a DIV and set the image as the background, but move the text to the right.  This is the way that the W3C are asking web designers to move to because it separates page content from decoration, which also seems to please Google et al...

<div style="border:1px solid red; width:400px; min-height:150px; background:url(happy_phone.jpg) no-repeat top left; padding-left:150px;">
   Cellpro Phones<br/>
   30 Auburn st<br/>
   Auburn, MA 01501<br/>
   (774) 249-0235<br/>
   C[removed]@gmail.com
</div>
0
 

Author Closing Comment

by:kate_nelson2001
ID: 31505549
Thanks!
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses
Course of the Month16 days, 11 hours left to enroll

862 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