Team Force Website Dying

[Petey]

Hey all.

Well, we've had the technological equivalent of a hurricane over at http://theforceteam.com. After Volte--our head coder/design whiz--wrote some cool CSS stuff to allow each post and paragraph to be displayed as a separate boxy-looking thing (I'm not sure how he did it, how it works, or how to describe it, and unfortunately he is away), the site looked great. On my Mac. In Safari and Camino.

Unfortunately, the site seems to be falling apart in IE on both Macs and Windows.

If anyone could
A) Let me know if the page looks screwy to them (and, if so, what browser and platform you are using to view it)
B ) Get some sort of idea as to what is going wrong, and how I might fix it
C ) Have brief mercy on our team if you're going to Manchvegas and are scoring different sites.

It would be much appreciated.

--Petey

p.s. I've attached some screenshots. The first image is how the page appears on my Mac using Safari (correct), and the second is how the page displays on my mac using IE (screwed up).

[jacob_dilles]

looks good from here (XP IE 6.0)

[Petey]

Originally Posted by jacob_dilles

looks good from here (XP IE 6.0)

The homepage isn't *too* bad, although you can definitely notice a difference between what it looks like and what it should look like.

The worst pages are: Links, Contact, About, Media...where the text goes all over to one side. I have no idea why it is happening.

--Petey

[Venkatesh]

Im looking at it right here from Firebird on Windows. Looks great. The little special effect with the boxes? Its quite magical.

Very Good job.

I took a quick look at it under IE 5.5. No problems. Looks almost like your screenshots, except with different fonts.

I'm suprised that the site doesn't work. You haven't been using the dark side too liberally, have you?

[Petey]

Originally Posted by Venkatesh

Im looking at it right here from Firebird on Windows. Looks great. The little special effect with the boxes? Its quite magical.

Very Good job.

I took a quick look at it under IE 5.5. No problems. Looks almost like your screenshots, except with different fonts.

I'm suprised that the site doesn't work. You haven't been using the dark side too liberally, have you?

Firebird should look great.

Well, it sure isn't working for me under Mac IE 5.2.3

Hmmm...

Would you mind posting a screenshot of what the "About" page looks like for you?

I'll be going back to the school for a FIRST meeting in about 30 minutes. I'll check on the Win2K boxes there...

Thanks for your help, guys.

--Petey

[Joe Matt]

I notice it slightly off on IE on Mac. The IE version is 5.2.2 and I'm running 10.2.6

[evulish]

Why in the world would anyone use IE for Mac, anyways? *hugs Safari*

Also, I tried looking through it but the code was a tad messy and made my brain hurt after a while For one, you had been using tables throughout the site then switched to div's for those posts where a table would have actually been easier. There's also stuff in the CSS (like, margin: -10px) that, I believe, was screwing up the title. You also have all those content div's inside an <h6> which was a bit confusing since those normally just contain text. :/ Also, IMO, the content text looks much better un-bolded (I think text looks loud and yelling if everything is bolded.. it loses the 'header' effect)

Ok. I messed around for a few minutes and did a little editing. This looks good in both Safari and IE5.2mac:

<!-- div for each content block -->
 <div style="padding: 10px">
  <div style="background-color:#696969; border: solid 1px #000; border-bottom: 0px; padding: 5px; font-weight:bold;">Welcome FIRST Newbies!</div>
  <div style="background-color:#80808; padding: 5px; border: solid 1px #000; font-weight:bold;">
   <p>Welcome to the homepage for Team 1073, or &quot;Team Force&quot;. New to FIRST? Then check out our <a href="firstnewbies.php">quick introductory page</a> explaining FIRST and our place in the grand scheme of things. </p>
  </div>
 </div>
<!--end content block -->

Exampled here: http://www.mehh.net:8080/www.theforceteam.com/

[deltacoder1020]

you wouldn't happen to be using the margin/padding CSS attributes, are you? some browsers seem to implement these strangely, some of them going by the distance from the edge of the page, and some going from the distance from the edge of the parent element.

[Hinkel Y.]

It's good on my comp, XP IE 6

Nice job on the graphics I really like it! Keep workin on it, I think it's turning out good

[Petey]

Thank you everyone for your help. I'm at the school now--it's looking better on the Win2K boxes here than it is on IE on my Mac, but it's still boxy.

By the way...does anyone know when this was to be judged by and by whom?

I'll try to get around to implementing some changes tonite.

Thanks,

--Petey

[Petey]

Originally Posted by evulish

Why in the world would anyone use IE for Mac, anyways? *hugs Safari*

Also, I tried looking through it but the code was a tad messy and made my brain hurt after a while For one, you had been using tables throughout the site then switched to div's for those posts where a table would have actually been easier. There's also stuff in the CSS (like, margin: -10px) that, I believe, was screwing up the title. You also have all those content div's inside an <h6> which was a bit confusing since those normally just contain text. :/ Also, IMO, the content text looks much better un-bolded (I think text looks loud and yelling if everything is bolded.. it loses the 'header' effect)

Ok. I messed around for a few minutes and did a little editing. This looks good in both Safari and IE5.2mac:

<!-- div for each content block -->
 <div style="padding: 10px">
  <div style="background-color:#696969; border: solid 1px #000; border-bottom: 0px; padding: 5px; font-weight:bold;">Welcome FIRST Newbies!</div>
  <div style="background-color:#80808; padding: 5px; border: solid 1px #000; font-weight:bold;">
   <p>Welcome to the homepage for Team 1073, or &quot;Team Force&quot;. New to FIRST? Then check out our <a href="firstnewbies.php">quick introductory page</a> explaining FIRST and our place in the grand scheme of things. </p>
  </div>
 </div>
<!--end content block -->

Exampled here: http://www.mehh.net:8080/www.theforceteam.com/

Thanks, evulish.

Well, that isn't quite what we had in mind, but that's definitely a starting place. Thanks for the code advice. Did you say that it shows up fine in your IE? Because it doesn't for me, on my Panther box, running IE 5.2.3

Meh. It looks so nice in Safari...and so uncool in IE...blargh.


--Petey

[steven114]

IE has notoriously bad CSS support, watch out...

[evulish]

Originally Posted by Petey

Thanks, evulish.

Well, that isn't quite what we had in mind, but that's definitely a starting place. Thanks for the code advice. Did you say that it shows up fine in your IE? Because it doesn't for me, on my Panther box, running IE 5.2.3

Meh. It looks so nice in Safari...and so uncool in IE...blargh.


--Petey

Well, I only did the "Welcome FIRST Newbies" one, and it looks good in IE5.2.3 here (but the rest are fubar). It appears that it looks the same as the screenshot (except I made the title font bigger.. but I don't remember doing that :/ Easily fixable, though) Hope it helps

Also, the browsers I find worthy enough to bother checking stuff on are in this order: IE 6.0, IE 5.5, Mozilla (latest build), Opera (latest), Safari, and Netscape 4 (for some reason, people still use this). I almost _never_ bother checking it with IE5.2 Mac. It's such an out-date, unfinished, and buggy browser, it isn't worth my time. I don't know of that many people that use it. Yeah, compatability rocks.. but when (if) you conform to web standards and it STILL looks incorrect in a browser (IE5.2 mac *cough*), enough is enough. I get more hits from google than I do from IE5.2 on my site

[Petey]

Originally Posted by evulish

Well, I only did the "Welcome FIRST Newbies" one, and it looks good in IE5.2.3 here (but the rest are fubar). It appears that it looks the same as the screenshot (except I made the title font bigger.. but I don't remember doing that :/ Easily fixable, though) Hope it helps

Also, the browsers I find worthy enough to bother checking stuff on are in this order: IE 6.0, IE 5.5, Mozilla (latest build), Opera (latest), Safari, and Netscape 4 (for some reason, people still use this). I almost _never_ bother checking it with IE5.2 Mac. It's such an out-date, unfinished, and buggy browser, it isn't worth my time. I don't know of that many people that use it. Yeah, compatability rocks.. but when (if) you conform to web standards and it STILL looks incorrect in a browser (IE5.2 mac *cough*), enough is enough. I get more hits from google than I do from IE5.2 on my site

You're right--IE 5.2 is probably worthless anyway.

Well, since we have been having some compatibility issues, along with other things, Volte and I have kinda redone the site at the last minute. Changed some colors and some widths. It is now more reflective of our "team identity"--that is, our blindingly orange team color.

Would still appreciate in knowing from any Winblows users out there how the site looks on their boxes.

--Petey

[David66]

Okay, i just cross referenced my HTML/CSS bible a little and the reason ( i think) for your problem is tag differences. make sure the source code states exactly wqhat everything is written in. IE doesnt always like to read DHTML and XHTML for some reason, not really sure why. I believe it has to do with the tag openings and closings...If worst coms to worst have your web designer write the CSS script on a windows using IE 6 as that is what most users scoring the website will be using. On a positive note the page looks fantastic in the newestversion of safari for 10.3!