Solved

adding an image to a css template (in dreamweaver)

Posted on 2008-10-12
3
256 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 250 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 250 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

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

747 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now