Wrox Programmer Forums
HTML Code Clinic Do you have some HTML code you'd like to share and get suggestions from others for tweaking or improving it? This discussion is the place.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the HTML Code Clinic section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
Old November 2nd, 2007, 08:06 AM
Registered User
Join Date: Nov 2007
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Default creating html from png

hi there,

I am a beginner on html/css and I am working on a web project where I have the website's design as a png file,and I have to crop images from this png and embed them as HTML and CSS.

I've been advised by some people not to use table and use div instead to while placing images.
My concern is that, can I really place all the website design based on div tag, also how am i going to specify an exact location for the image on the website?

I would be glad if you can recommend me starting point for this project.

thanks in advance.

Old November 2nd, 2007, 08:12 AM
Wrox Author
Join Date: Oct 2005
Posts: 4,104
Thanks: 1
Thanked 64 Times in 64 Posts
Send a message via AIM to dparsons

Yes it is possible to get away with not using Tables to layout your interface. While it is not "wrong" to use tables to layout your design it is a dated practice and the same effects can be achieved through CSS and Div tags.

This URL should have plenty of reference material for you:


================================================== =========
Read this if you want to know how to get a correct reply for your question:
================================================== =========
.: Wrox Technical Editor :.
Wrox Books 24 x 7
================================================== =========
Old November 2nd, 2007, 10:02 PM
Friend of Wrox
Join Date: Jun 2007
Posts: 477
Thanks: 10
Thanked 19 Times in 18 Posts

Absolute positioning in CSS can be used to effect a very similar look to a table based layout. It also has the advantage that you can specify pixel exact locations, something that's not as easy in a table based layout. However, CSS also gives you a huge variety other options as well. And if you use CSS properly (using an external .css stylesheet file) You can control every aspect of the website's appearance from one file. So if your client tells you all the headings on the website has to be red, you simply add this to your stylesheet.

h1, h2, h3, h4, h5, h6 {

And when they change their mind and want the headings navy blue instead you change that to:

h1, h2, h3, h4, h5, h6 {

as opposed to table based layouts that require you to alter the inline styles of every heading on the site, everytime you need to make a change. CSS is a huge timesaver, for those inevitable last minute changes that would otherwise add hours of time to your site development. Hours of tedious mind-numbing work that you don't want to do and that your client doesn't want to be charged for. CSS also gives you the power to go back later and make comparatively major changes in website design without really building a new site. Simply by swapping out graphics and redoing the stylesheet, you can completely change the appearance of a CSS site without touching a single webpage. It's not something you're called upon to do frequently, but it's a HUGE timesaver if you do.


Whatever you can do or dream you can, begin it. Boldness has genius, power and magic in it. Begin it now.
-Johann von Goethe

When Two Hearts Race... Both Win.
-Dove Chocolate Wrapper

Chroniclemaster1, Founder of www.EarthChronicle.com
A Growing History of our Planet, by our Planet, for our Planet.

Similar Threads
Thread Thread Starter Forum Replies Last Post
converting a HTML file to png file timcyberbanjo General .NET 0 October 21st, 2008 04:30 PM
Creating HTML tables dynamically dotnet cat ASP.NET 1.0 and 1.1 Basics 1 August 25th, 2005 10:58 PM
Creating a html in an xsl document allenatmarc XSLT 2 June 16th, 2004 04:10 AM
PNG Transparency in IE richard.york Javascript 4 January 19th, 2004 08:26 PM
creating dynamic html pages moushumi Javascript How-To 1 August 16th, 2003 12:31 PM

Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.