Page width

[Olly]

I am looking at resizing me web page so that it is always a fixed width. At the moment my page automatically adjusts to fit the browser, what are your opinions on page width?

I am looking at www.ukdigital.co.uk and like the width but it would be good to have the browser set to that size so that it cannot be adjusted. Is this reasonably easy to do?

Also, would i have a problem with dofferent operating systems etc...?

[jont]

Fiddling with peoples browsers is a big no no. They may have accessability issue, require them sized a certain way to see other parts of the desktop or even have Javascript disabled which makes any scripts used to re-size pointless and simply adds to page overhead.

Setting a fixed width page can look and work very well, as can a stretch to fit style ... it is down to implementation. The ukdigital site works very well at a fixed page width and it does not matter there is a huge amount of white space to the right of the content (on my monitor).

Why not create a fixed width template and apply it to one test section to see how the formatting works. You will need to take a careful look at the product templates and navigation system as space for the all important product is now at a premium so careful layout is very important.

At the moment I have gone full circle from designing fixed widths to stretch to fit and the last 2 are back to fixed widths again! But the product and feel of the site suited a fixed width IMHO

[simonwar]

Using 760px fixed width ....

I am using a centred fixed width template at 760px inside a table.

I have then split this into 5 columns;

1 LH navigation
3 body columns
1 right hand edging

It can be a bit fiddly as Jont says with regard to getting other templates to fit within the body, but it suits me at the mo, and is forcing me to understand the Actinic templates on the way, as i have to make them work.

I used the "Retro" Theme as a base line and modified it from there. I cheated a bit to start and actually copied Retro to Retro_backup and then permanently modified Retro, so that when i underwent some Theme switching early on in my developments i would not lose the mods i carried out on Retro. Do this at your own risk and backup the theme before you do !

Hope this helps, Simon.

[impos]

Automatic Resize

How do you get the webpage to automatically resize please

[simonwar]

A table will auto resize to its largest content, text will wrap ...

Tables will auto shrink and expand, if

a) content within it does not force the width. For example if you have an image that is 200px along side another cell with and image 50px on the same row, you cannot shrink this without loss of the image passed 250px, (depending on your table border and cell padding of course). and

b) you set the table width to 100% to W=100%

Tables will auto shrink to browser window size. Take the following of example and cut and paste it into the body pf a new basic page. Preview the page and shrink the browser back and for and notice the table shrinks and expands. Have a go you will see what I mean:

<table width="100%" border="0" cellspacing="0" cellpadding="5">
  <tr> 
    <td width="31%">Some text to show auro resizing in this cell when the browser 
      window shrinks ...... </td>
    <td width="13%"><img src="../88-x-31-web-safe-2powered-b.gif" width="88" height="31"></td>
    <td width="56%">Some text to show auro resizing in this cell when the browser 
      window shrinks ...... </td>
  </tr>
  <tr> 
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><img src="../125x125-square-GROW.gif" width="125" height="125"></td>
  </tr>
</table>

The images in this example are in your Site1 folder, so tweak the path to suit.

Was this what you mean or where you looking for code that detects the users browser and automatically sets the page width ?

Simon.

[jont]

You can also modify Simons example further if you are using fixed left and right hand columns eg for navigation and for special offers etc and not specifying a size of the middle cell

<table width="100%"  border="0">
  <tr>
    <td width="150">left hand nav column</td>
    <td>middle column</td>
    <td width="150">right hand special offers</td>
  </tr>
</table>

that way your 2 outside columns remain a fixed size (150 pixels) and the centre column with your page content (products) expands and shrinks as the browser is resized... this maintains a constant size for your navigation and special offers.

You can take it further and start nesting tables inside the middle cell for example but this get quite complicated and is being replaced by CSS positioning