HTML Page Editing 'Trick'

[Guest]

Most everyone who knows HTML knows this, but I'll put it in black and white for any of you who are new to HTML.

 

Many of the osCommerce pages consist of tables - lots and lots of tables. Tables are usually used to position elements on an HTML page and it seems that osCommerce more tables than they need to. That fact not withstanding, when you are trying to reposition elements on a page it would be useful if you could see the limits of the table the element is in. Here's how you can make that table and element repositioning a bit easier.

 

Download (via FTP) the page you want to edit from your host site to your local system and open it in a text editor - Notepad is as good as any and it is free, in that it comes with Windows. In the open table tag (ex: <table border="0" width="100%" cellspacing="0" cellpadding="0">) , simply change border="0" to border="1", save and upload that page. Now, refresh the page in your browser and you will see a narrow line border around the table(s) you just changed. You can now get an idea of why the elements are positioned the way they are.

 

When you go back to the downloaded page and you should have an easier time of moving the page elements around to meet you design preferences. As you make changes, upload them, refresh your browser, see if your changes are what you want. Keep doing this until you are happy with what you did. When you get all the page elements positioned the way you want, simple change border="1" back to border="0", re-upload the page and you should be done.

 

Dave

[Guest]

Most everyone who knows HTML knows this, but I'll put it in black and white for any of you who are new to HTML.

 

Many of the osCommerce pages consist of tables - lots and lots of tables. Tables are usually used to position elements on an HTML page and it seems that osCommerce more tables than they need to. That fact not withstanding, when you are trying to reposition elements on a page it would be useful if you could see the limits of the table the element is in. Here's how you can make that table and element repositioning a bit easier.

 

Download (via FTP) the page you want to edit from your host site to your local system and open it in a text editor - Notepad is as good as any and it is free, in that it comes with Windows. In the open table tag (ex: <table border="0" width="100%" cellspacing="0" cellpadding="0">) , simply change border="0" to border="1", save and upload that page. Now, refresh the page in your browser and you will see a narrow line border around the table(s) you just changed. You can now get an idea of why the elements are positioned the way they are.

 

When you go back to the downloaded page and you should have an easier time of moving the page elements around to meet you design preferences. As you make changes, upload them, refresh your browser, see if your changes are what you want. Keep doing this until you are happy with what you did. When you get all the page elements positioned the way you want, simple change border="1" back to border="0", re-upload the page and you should be done.

 

Dave

Good tip.

[Ronaldinho53]

If you use Firefox, there's a great add-on called Firebug that will help you locate and edit tables, css styles, and a lot of other elements in real time. You can't save the changes you make, but you can then go back to your files to make the necessary changes.