Larger than Life?

[GiftedLlama]

Hi - I've just gone live & initial feedback shows I have a bit of a size problem!

The problem seems to be with certain browsers, the home page loads but it is too large for the page which means people have to scroll across as well as down.

In an attempt to slim things down. I have reduced the width of my corporate logo and moved all the R/H text boxes over to the left via Design|Options|Layouts|Primary Layouts|Sidebar down the left hand side but that leaves me a big gap on the right hand side. It seems to me that the navigation bar may be controlling the width but deleting options from the bar doesn't change things. (I'm using the Smart theme).

Does anyone have any ideas on losing a couple of inches?
(I don't get this problem on my screen so I'm not sure how annoying/ important it is .?)

Thanks alot

Jackie

www.giftedindesign.co.uk

p.s. Any general feedback on site greatly appreciated.

[pinbrook]

the problem you have revolves around different monitors using different resolutions.

you have your monitor set to 1024x768 or higher.

the poor bods veiwing in 800x600 lose the right hand side of the design.

Most designers design for both 800x600 and 1024x768 as these are the 2 most used resolutions.

Your banner/logo is 1100 pixels wide, reduce this to 720, and veiw the difference.

Tell us when you have done this so we can help you with the rest of the layout

[GiftedLlama]

Larger than life?

Thanks Jo -

Tried 720 but that left a large empty block on the right hand side.

I have uploaded 1020 - which still leaves a empty block but would that then
suit all monitors?

Ummm?

Jackie
www.giftedindesign.co.uk

[pinbrook]

if you use a logo at 1020px it will never fit on to a 800x600 res.

the logo needs to be less than 800 pixels wide to avoid scrolling

[GiftedLlama]

Ok thxs - I get it now!

Logo now back to 720 pixels. Would like to keep the R/H boxes if poss..?

[pinbrook]

Ok, you've got a bit of fiddling to do.

I've looked at the html and your main table is too wide. Like the logo it should fit to 720 wide.

the left and right columns are 150 each, so you can leave these at fixed width. You need to set the centre column so that it is liquid, ie stretches and contracts according to the screen res. width will be set to percentage

Most tables are set to 100%, I think you may have ACTSWIDTH set to 600 (Design menu|options|sitedefaults) try 100% in the value.

Otherwise you will need to search throughthe code looking for a hard coded fixed value in the centre column somewhere, once this is removed your design will decrease in width and fit more res.

[GiftedLlama]

Thanks for your help with this.

You were right about the ACTSWIDTH - it was set to 600. It wouldn't let me put in a % sign so I've blanked it out completely. (Is that the right thing to do?)

As I have a 1024x768 I can't see if this has fixed the problem. Could someone viewing in 800x600 let me know if they still have to scroll across to view the page?

Thanks
Jackie

www.giftedindesign.co.uk

[mike@rfsl]

You can change your own screen resolution to check it (right click on desktop)

It would be good if you made the section behind the logo the same colour as the logo so that it doesn't notice on higher resolutions.
In the smaller res your getting some weirdness with the content coming out of the main table, im not sure why this is happening, maybe you have set some column widths too high in the table..

[Artisan]

Could someone viewing in 800x600 let me know if they still have to scroll across to view the page?

According to the global stats at http://www.thecounter.com/stats/2004/September/res.php, around 33% of users are still on 800x600, so I'm still designing for that resolution.

I've found that the optimum width for the page is 770 pixels for 800x600 res. Using the Smart theme, with the side columns set to 160 wide, ACTSTDWIDTH works out at 430 which allows 10 pixels for the spaces between columns. You also need the set the table width to 430 in Act_ProductBody.html.

Your logo is 790 pixels wide at present, and results in a small sideways scroll, so it would be best to reduce it to 770.

Hope this helps.

Malcolm

[GiftedLlama]

Thanks Guys - Really appreciate your help.



[QUOTE=mike@rfsl]It would be good if you made the section behind the logo the same colour as the logo so that it doesn't notice on higher resolutions.
QUOTE]

Good idea. Can you advise me how to do this?

[cdicken]

Can you advise me how to do this?

Go to 'Design | Options | Layouts' and click 'Edit' next to the 'Default Overall Layout' field. Find this code:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr> 
    <td align="left" bgcolor="NETQUOTEVAR:PALCOLOR2CSS"> 
      NETQUOTEVAR:LOGOIMAGE
    </td>
  </tr>
</table>

and change

bgcolor="NETQUOTEVAR:PALCOLOR2CSS"

to

bgcolor="black"

[GiftedLlama]

Thanks for your help...

I have done this but something seems to be wrong..

I changed the Act-Primary.html to say the following:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" bgcolor="black">
NETQUOTEVAR:LOGOIMAGE
</td>
</tr>
</table>

but it hasn't changed the background. Do I need to change it anywhere else?

Jackie

[darrentickle]

Hi Jackie

You might want to download a copy of FireFox http://www.mozilla.org/products/firefox/ ,and download the developers extension. This will give you help with issues like this, and makes live a bit easier for you when testing your site.

I hope this helps a bit.

Cheers

Darren

[GiftedLlama]

Ah Ha! I've solved my problem - I needed to change Act_BrochurePrimary.html too.

Thanks for the tip Darren - I'll have a look at that now. Need all the help I can get!!

Jackie