14 replies [Last post]
slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

http://www.memoriesforevervideo.com/index2.php

This works fine in Firefox but breaks in IE6. Could someone tell me what hack I need to apply to get it to work?

Steve

Anonymous
Anonymous's picture
Guru

Re: Could someone tell me why this layout doesn't work in IE

Some of us don't have IE so a screen shot or at least a description of the problem would be kinda nice. Smile

slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

Could someone tell me why this layout doesn't work in IE?

An excellent point. I would have never thought that people don't have IE! Smile Screen shot is attached.

Steve

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 9 years 10 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

Could someone tell me why this layout doesn't work in IE?

IE believes there is insufficient space for the two elements to float side by side. Try removing the 7px margin off one of the two elements. Also IE may have its "3px jog" problem. You can get around that by floating the videocontainer right and removing the margin-left.

Anonymous
Anonymous's picture
Guru

Could someone tell me why this layout doesn't work in IE?

slbailey wrote:
I would have never thought that people don't have IE
You're new here, eh? Laughing out loud

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 3 years 4 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Could someone tell me why this layout doesn't work in IE?

Hi

Looking at screenshots, the divs are different widths in each browser (FF1.07 vs IE6.2)

That must be the root of the problem.

Trevor

slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

Could someone tell me why this layout doesn't work in IE?

Take the width of "aboutuscontainer" -- that is supposed to be 150px wide with a 7px border on each edge. Are you telling me that IE and Firefox render that 'configuration' differently? And, if so, is there a global way to resolve it or do I need a separate set of css for each browser?

Steve

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 7 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Could someone tell me why this layout doesn't work in IE?

I reckon you'd be better off doing something like this:

<div id="aboutuscontainer" class="container">
<p>Memories Forever wants to provide you with the highest quality wedding video possible.</p>
<object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf" width="320" height="240">
            <param name="movie" value="FLVPlayer_Progressive.swf" />
            <param name="salign" value="lt" />
            <param name="quality" value="high" />

            <param name="scale" value="noscale" />
            <param name="FlashVars" value="&skinName=clearSkin_3&streamName=videos/Demo360k&autoPlay=true&autoRewind=false" />
          </object>
      </div>

and then just adding a left-border to your <object> tag (you can style it with CSS just like any other tag). You might still have to float it right though.
By the way I've edited your <object> tag along the lines laid out here.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 3 years 4 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Could someone tell me why this layout doesn't work in IE?

Do a screenshot of each and measure it yourself.

I've deleted the images now, but I think one was 149px and the other was 150px.

I did measure the others too.

Trying to get floats to so tightly behave is going to be a bit of a nightmare!

Trevor

Anonymous
Anonymous's picture
Guru

Could someone tell me why this layout doesn't work in IE?

AHHHHHH!!! I clicked on the link and it screeched at me! AHHH! Evil

slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

Could someone tell me why this layout doesn't work in IE?

ClevaTreva wrote:
Trying to get floats to so tightly behave is going to be a bit of a nightmare!

So I'm noticing. This could have been whipped out in seconds with tables but I refuse to do that. Is there a better way to do this other than with floats? I can't find it if it is.

slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

Could someone tell me why this layout doesn't work in IE?

Triumph wrote:
AHHHHHH!!! I clicked on the link and it screeched at me! AHHH! Evil

Did I do something wrong? What link did I post that is misbehaving? sorry.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 7 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Could someone tell me why this layout doesn't work in IE?

slbailey wrote:
ClevaTreva wrote:
Trying to get floats to so tightly behave is going to be a bit of a nightmare!

So I'm noticing. This could have been whipped out in seconds with tables but I refuse to do that. Is there a better way to do this other than with floats? I can't find it if it is.
I gave you a suggestion further up. Using the method I posted, you won't have a problem with floats being nested too tightly. On top of which it involves less mark-up which is always a good thing.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

slbailey
Offline
newbie
Last seen: 16 years 1 week ago
Joined: 2005-11-29
Posts: 6
Points: 0

Could someone tell me why this layout doesn't work in IE?

Tyssen wrote:

I gave you a suggestion further up. Using the method I posted, you won't have a problem with floats being nested too tightly. On top of which it involves less mark-up which is always a good thing.

Could you possibly have been missing a tag in your recommendation? You have the video clip nested in the aboutuscontainer after the paragraph tag which resulted in the video playing beneath the text. I'm going to try a display:inline and see if that resolves the problem.

Again, gross apologies to everyone for sounding ignorant but this is my first serious foray into hard core CSS so I'm learning as I go.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 7 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Could someone tell me why this layout doesn't work in IE?

I didn't test it before I posted it but having had a look: give the container a width, float the <p> left and give it a width and float the object right. Playing around with the widths, borders, margins etc should result in what you want.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference