# dreamweaver - span top bar



## lola2001 (Jan 29, 2001)

I made a little swf banner and put it at the top of an html page. At first I made the flash file 1024x100 and I change the width to 100% in the dreamweaver property inspector, however both ends were cut off online. So I changed the flash file to 800x100 now it looks great at 600x800 res, but 1024x768 the banner is centred in the middle of the page.

How can I get the banner to span the size of the webpage no matter the resolution? Thanks.

If you need to see it, it's here: www.egetec.ca/test4/index.html


----------



## Shadow2531 (Apr 30, 2001)

A height of 22% will help, but that's hot really the problem.

The problem is all the space the flash file has.
http://www.egetec.ca/test4/front.swf

When you set the height to 100px, it forces the space in the flash file from above and below to the sides.

That is of some concern, but it looks like at low resolutions, some of the content in the tables is forcing the table to be wider than 100%.

If you remove everything except the flash file, you will see that it does indeed center at low resolutions.

So there is something in the table not allowing it to shrink enough and therefore it will be wider than the flash file at low resolutions.

I don't see a scalable layout working the way you have things now.

This will help for testing purposes.
http://home.tbbs.net/shadow/tsgforums/flashtest.html

With that example, nothing is really centered. The animation is centered, but only because it's centered in the flah file.

Nothing is really centered in your layout either because you are using a 100% width as well.

Because of that, trying to center the flash with centering attrbutes won't help.

What will help is stoping your table content from overflowing at low resolutions.

Set your table background to red or another color and you will see what I mean. When you lower the resolution, the table sticks out the side.

The flash and table will still be 100% width, but the table's width is actually overflowed. Since the Flash doesn't overflow at low resolutions, the table and the flash don't match.


----------



## lola2001 (Jan 29, 2001)

I'm sorry, I don't understand. I'm not really trying to centre the flash movie. It's already centred. I really want it to cover the whole width of the page no matter the resolution. I've put in another table at the top and put the movie in there but it is still not stretching. Thanks.


----------



## bassetman (Jun 7, 2001)

Looks fine on mine I am running 960X720


----------



## lola2001 (Jan 29, 2001)

I think I fixed it. I took out the centre tags and it stretched. Weird. Thanks.


----------



## bassetman (Jun 7, 2001)

Hmmmm, darn computers!


----------



## lola2001 (Jan 29, 2001)

LOL...I know what you mean. It's always something


----------



## Shadow2531 (Apr 30, 2001)

Not that it matters now, but I did understand that you were not trying to center it and only stop it from not stretching at low resolutions.

I can go into more detail on my first post if needed, but glad you got it.

Just make sure you check your page in multiple browsers. (if you want ; ) )


----------



## lola2001 (Jan 29, 2001)

I ended up making the flash file 600x50, that way it stretches for the higher resolutions.

I'm only using IE6 so if anyone wants to take a look at it with another brower it would me much appreciated:

I had to move it: 
www.egetec.ca/test/index.html

Thanks.


----------



## Shadow2531 (Apr 30, 2001)

At a window size of ~ 671: 443 and lower, it doesn't expand in opera.

Same goes for Firebird, Mozilla and Netscape.

One of the problems is DW doesn't produce code that invokes standards mode in browsers.

The doctype needs to be fixed first before you even try to fix the other problems.

I'm not preaching to you too much on compliancy, but the code should at least invoke standards mode in browsers or cross-browser rendering is going to be different.

Specifically.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

is missing the dtd uri.

It should be this.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

That can make a large difference.

If Netscape 4.8 is a concern, I can test it with that also.

The problem might be because your titlepurple.jpg isn't scalable as well.

It's got a static size and at small resolutions, the table can't shrink down as far as it should.

Without redoing all the code, I might put the flash inside the table as well. Then you might be able to get the flash animation to scale with the size of the table instead. Something to consider anyways.


----------



## lola2001 (Jan 29, 2001)

Thank you for all of your checking. I will change the doc type for sure but I'm not sure how to make the titlepurple.jpg scalable, could you give me some direction on this? I have put the flash in a table already and seems to work fine in IE.


----------



## bassetman (Jun 7, 2001)

Doesn't work in my NS Communicator 4.79


----------



## lola2001 (Jan 29, 2001)

Oh...what happens exactly? Thanks.


----------



## Shadow2531 (Apr 30, 2001)

You know how you used percentages for the flash?

You would have to do the same for the titlepurple.jpg.


----------



## Shadow2531 (Apr 30, 2001)

In Netscape 4.8, the width and height for the embed are being ignored or recognized improperly.

If you want netscape 4.8, you can get it at ftp://ftp.netscape.com/pub/communic.../windows95_or_nt/complete_install/cc32d48.exe

For testing Of Netscape, Mozilla, and Firebird, you really only need to download Mozilla and or Firbird.

Netscape renders the same as mozilla 1.4 and Mozilla and Firebird render virtually the same.
(Mozilla.org)

www.opera.com is where you can get opera 7.21.


----------



## Shadow2531 (Apr 30, 2001)

Set the width of your titlepurple.jpg 60% or 50% and leave the height at 300.

It will then scale right. Of course the image will get distorted at low resolutions, but that's expected with pics like that in a scalable layout.

I'm checking out the flash size in netscape 4.8 right now.


----------



## Shadow2531 (Apr 30, 2001)

When I suggested that the flash be in the table, I didn't mean it's own table, but the table that everything else is in.

Try this. (leave the picture set to 534 x 300)
get rid of the table that the flash is currently in.

Above the first tr in the main table add this.

[TR]
[TD]Your flash[/TD]
[/TR]

Now what will happen is this..

It will be scalable untill it hits the spot where the table can't shrink anymore because of the titlepurple.jpg.

Then it will be a fixed layout and because the pic is inside the table, the pic will follow the rules of the table.

It works in opera for sure.

So it will be a fixed layout at low resolutions and a scalable layout at high resolutions.

The netscape 4.8 problem of not displaying the flash at the right size is because the cell it's in needs a fixed width and if it inherits a variable with or has a variable width set, it will not display right.

Netscape4.8 can't set the size of the flash to 100% if the cell it's in doesn't have a width set in pixels. or has a width set in percentage with the parent table set to a fixed width.

You can halfway fix the netscape 4.8 problem by using style="width: 100%" for the embed tag. It seems to honor it better than the regular width attribute.

The animation then almost displays full size, but turns into a tiny litle animation as soon as the window shrinks a little.

That should be enough info to give you some things to try.

Hope that helps.


----------



## lola2001 (Jan 29, 2001)

Thank you for your help. I will make the necessary changes.


----------

