943,769 Members | Top Members by Rank

Ad:
Sep 24th, 2005
0

Dreamweaver wrapping text around Pics

Expand Post »
I have a small problem. I want to make a basic page with an image in the upper right hand corner with the text wrapping around it. I cannot seem to figure this out. I am not a newbie to web design so I feel like a dunce.....
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
carlco9020 is offline Offline
8 posts
since Sep 2005
Sep 24th, 2005
0

Re: Dreamweaver wrapping text around Pics

Quote originally posted by carlco9020 ...
I have a small problem. I want to make a basic page with an image in the upper right hand corner with the text wrapping around it. I cannot seem to figure this out. I am not a newbie to web design so I feel like a dunce.....
You want the image to be a background image.

Now, learn HTML and CSS, or else you will be lost and confused for the rest of your web design spree.
Team Colleague
Reputation Points: 1135
Solved Threads: 171
Super Senior Demiposter
Rashakil Fol is offline Offline
2,478 posts
since Jun 2005
Sep 26th, 2005
1

Re: Dreamweaver wrapping text around Pics

I think what you are looking for is an "align=" inside your image tag. This can be done painlessly in dreamweaver. First add your image to the page and in the layout mode you should see it on the page. Next click on the image and in the properties pane at the bottom you should see a box that says align in the bottom right simly select your poison from there and it will align the image. you should now select code view and see that it added an align='''' property to the image tag.
Reputation Points: 10
Solved Threads: 0
Junior Poster in Training
bkendall is offline Offline
69 posts
since Jul 2005
Jun 14th, 2007
0

Re: Dreamweaver wrapping text around Pics

This doesn't seem to work for me. I have the same issue, and this solution leaves the image in line with text. I'd like the text to wrap around the image without creating a large gap between lines. This would be similar to the text wrapping in Microsoft Word.
Reputation Points: 10
Solved Threads: 0
Newbie Poster
lord ashley is offline Offline
1 posts
since Jun 2007
Jun 14th, 2007
0

Re: Dreamweaver wrapping text around Pics

The align= attribute is deprecated. Use the style float: right; in a stylesheet class used in the img tag or in a style= attribute in the image tag.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Jul 9th, 2009
0

Re: Dreamweaver wrapping text around Pics

Click to Expand / Collapse  Quote originally posted by carlco9020 ...
I have a small problem. I want to make a basic page with an image in the upper right hand corner with the text wrapping around it. I cannot seem to figure this out. I am not a newbie to web design so I feel like a dunce.....
I find an effective and easy way to text wrap is by using borderless tables. You can merge cells etc as appropriate. This views well in both firefox and explorer. Wish there was a wrap text button though!
Reputation Points: 10
Solved Threads: 0
Newbie Poster
jelliott89 is offline Offline
1 posts
since Jul 2009
Jul 9th, 2009
0

Re: Dreamweaver wrapping text around Pics

Layout programs do not produce optimised code
they can do many things, but only the way they were programmed to do
often thimes the best result is to go into "code view" after the page layout is completed and fix it
html Syntax (Toggle Plain Text)
  1. <p><img src='thispic.jpg' alt='a picture' width='80' height='60' style='float:right; margin:5px padding:5px;'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
or if many images are to be the same appearance
html Syntax (Toggle Plain Text)
  1. <head>
  2. <style type='text/css'>
  3. <!--
  4. .detail { float:right; margin:5px padding:5px; width:80px; height:60px; }
  5. -->
  6. </style></head><body>
  7. <p><img src='thispic.jpg' alt='a picture' class='detail'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
  8. <p><img src='thatpic.jpg' alt='another picture' class='detail'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
wrapping the image and text in a <div> or <p> performs a 'keep toghther' so that the text and image remain associated
Last edited by almostbob; Jul 9th, 2009 at 9:45 am.
Reputation Points: 562
Solved Threads: 368
Posting Maven
almostbob is offline Offline
2,970 posts
since Jan 2009
Oct 22nd, 2009
0
Re: Dreamweaver wrapping text around Pics
This is a big help, thanks! I've been stuck on doing this for ages
Reputation Points: 10
Solved Threads: 0
Newbie Poster
sicoev is offline Offline
4 posts
since Oct 2009
Oct 24th, 2009
0
Re: Dreamweaver wrapping text around Pics
here I found many having a great concept of dreamweaver.as am still a learner I need suggestions and guidance like this from time to time.I think it is here I can refer to
Reputation Points: 10
Solved Threads: 1
Newbie Poster
keddy1 is offline Offline
9 posts
since Sep 2009
Dec 21st, 2009
0

Thanks!

Thank you!!! Works beautifully.

Click to Expand / Collapse  Quote originally posted by almostbob ...
Layout programs do not produce optimised code
they can do many things, but only the way they were programmed to do
often thimes the best result is to go into "code view" after the page layout is completed and fix it
html Syntax (Toggle Plain Text)
  1. <p><img src='thispic.jpg' alt='a picture' width='80' height='60' style='float:right; margin:5px padding:5px;'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
or if many images are to be the same appearance
html Syntax (Toggle Plain Text)
  1. <head>
  2. <style type='text/css'>
  3. <!--
  4. .detail { float:right; margin:5px padding:5px; width:80px; height:60px; }
  5. -->
  6. </style></head><body>
  7. <p><img src='thispic.jpg' alt='a picture' class='detail'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
  8. <p><img src='thatpic.jpg' alt='another picture' class='detail'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim turpis, consectetur sed hendrerit eu, fringilla iaculis ante.</P>
wrapping the image and text in a <div> or <p> performs a 'keep toghther' so that the text and image remain associated
Reputation Points: 10
Solved Threads: 0
Newbie Poster
annie707 is offline Offline
1 posts
since Dec 2009

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in Site Layout and Usability Forum Timeline: Unrelated DIV getting refreshed in paged Dataset region
Next Thread in Site Layout and Usability Forum Timeline: apologize, but it is very informative





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC