positioning pictures and text

Forum home » Delegate support and help forum » Dreamweaver Training and help » Positioning Pictures and Text

Positioning Pictures and Text

resolvedResolved · Urgent Priority · Version CS3

Gian has attended:
Dreamweaver Introduction (2 days) course

Positioning Pictures and Text

Hi

I started building my first real website yesterday which I am trying to get online tonight. I am having trouble in putting all of the pictures in the right places and then having the text aligned properly.

I have used tables which let me position the picture in a certain place but then the text affects the position (ie if I align the picture left and then type in the table it pushes it to the right).

Is there any way of putting a picture exactly where I want it on the page and to be able to move it around (ie how you do it on Word and Powerpoint, by moving it on the page with the crosshairs symbol and just dragging it to where you want it) and then to put the text wherever I want it to be on the page, without having to use a load of tables?

many thanks

Gian Luca

RE: Positioning Pictures and Text

Hi Gian,

Yes, you can do this. What you do, is insert a 'layer' into your web page, and then insert your picture into the layer. If you make the layer absolute positioning (see the properties panel when your layer is selected) you will be able to position your layer at the exact X,Y coordinate of your choosing.

Be aware though, that a web page behaves differently to Word or Powerpoint, because people view pages on their own computer, using their own browser. It's not standardised like Word or Powerpoint. If they resize their window, the text wrapping may be different, or your image may be too far to the right on their screen, and they may need to scroll to the right to view it.

You should design your page so it's flexible, and will resize accordingly when the user resizes their browser window. And usually this means letting the text wrap however it chooses.

Rather than use tables to layout your page, you may be interested in searching for 'CSS layout' in google to discover new ways of laying out your page. Your web pages will load much faster as a result (less code), and you will have a lot more flexibility to change your layout in the future.

CSS layout allows you to create many 'DIVs' with content (separate your content into sections). Then you apply a CSS (style sheet) file to your page which controls the layout of all the elements, as well as colours, borders, margins, padding etc.

Try this to get started:
http://www.glish.com/css/

And also have a look at the interesting experiment at http://www.csszengarden.com where different CSS designers and artists can control the look and feel of the same web page, just by adjusting the CSS file.

Hope this helps.

Good luck, and we look forward to answering any more questions you may have.

Regards, Rich

 

Training courses

 

Training information:

Welcome. Please choose your application (eg. Excel) and then post your question.

Our Microsoft Qualified trainers will then respond within 24 hours (working days).

Frequently Asked Questions
What does 'Resolved' mean?

Any suggestions, questions or comments? Please post in the Improve the forum thread.


 

Dreamweaver tip:

Quick Tag Editor

If you want to quickly access your HTMl tag while in design view, highlight your item on a page and press Ctrl+T

View all Dreamweaver hints and tips


Server loaded in 0.06 secs.