View Full Version : 2 major problems... I'm so frustrated :(


Jacenta
04-05-2006, 06:04 PM
Hey everyone,
I officially HATE IE!
I’m having two programs with two of my sites. Here is my programs:

1) Site: http://www.tri-m.com/test/products.html
CSS: http://engineering.tri-m.com/stylesheet.css
Problem: Alright it looks totally fine in firefox… but than open it up in IE. If you have a small res. than it will look fine but if you have a res like mine which is 1280 by 1024 it looks like this: http://img383.imageshack.us/img383/9147/ie3ej.gif
In firefox it looks like this: http://img383.imageshack.us/img383/2920/firefox7dq.gif
I designed this in CSS and tables. Basically what I was trying to do is have the topbars always at the top and the bottom bars always at the bottom, than have the middle take up the rest of the room… so yeah, have a liquid layout. I thought of trying a simple ie hack and just going “_height:” but than that would only be set for my res. IE seems to be ignoring the attribute in the #content when I put “*” as the height and if I put it as 100% than the #content stretches has big at the screen would be, instead of just filling in the rest of the screen.
I really really really need someone’s help. If anyone knows how to fix this or a workaround that would be sooo awesome! :D

2) Site: http://www.signavpalace.com
HTML Code: (I uploaded a seperate file so you could see it) http://www.signavpalace.com/html.html
CSS: http://www.signavpalace.com/palacestylesheet.css
Javascript for Navigation: http://www.signavpalace.com/forum_skin/navigation/javascript.js and http://www.signavpalace.com/forum_skin/navigation/javascript2.js
Problem: Alright well if you open up my forum in firefox, the navigation is positioned where I want it to be. On the other hand, if you open it up in IE than the navigation is in the WAY WAY WAY wrong place. I’ve tried everything… divs, tables, looked through all the coding… I don’t know what is the problem. The navigation I made with opencube.com. Here is my template where I built it: http://www.signavpalace.com/forum_skin/navigation/navigation.htm

So many people have tried to help me… but no one can figure this out. If one of you can that would be awesome!!! If not than who should I ask for help? Could it be something wrong with opencube or invisionfree?



You guys are always awesome in the support area! Thanks sooo much! I posted this in General and CSS because I don’t know if it is really a CSS problem I’m having or something totally different. 

- Jacenta

Koreyvarcoe
04-05-2006, 09:09 PM
This is why I always make sites in IE first. Cause they will always look good in firefox. Have you tried to adjust the heights? Or if that bg picture in the topbanner is from a site maybe save it so it will strech? Im not sure. Sorry for this if it doesnt help lol.

Jacenta
04-05-2006, 10:14 PM
Yeah I've already tried that for the 1st problem.

Yeah I've been told that it's actually better to code for firefox first than for ie. :S Mostly because you can fix things after with ie hacks.

ahhhh is anyone else able to help with ethier one of my problems?
-Jacenta

Jacenta
04-06-2006, 06:11 PM
Alright I don't need help for the second problem anymore. Just the first. I was recieving help in the General Forum but now I know this is a CSS problem so I want to talk about it in here.

You may not be able to see it on your computer because your res is too low... but I have a high res computer and when I open up my computer in firefox it does what I want. When I set the #content height:100% it takes up the rest of the space left over once the #topbar,#navigation, #bottombar and #copywrite have filled up the space of the monitor.
Here is a screen shot of it:
http://img369.imageshack.us/img369/5608/firefox9km.gif

In IE it is rendering the height:100% very differently. I'm not really sure what is happening and how to fix it. It looks like the #topbar and #bottombar are being stretched when they are set to absolute heights and its ignoring those attributes.
Here is a screen shot of it: http://img390.imageshack.us/img390/3774/ie2zo.gif

Here is my css:
/* CSS Document */
html, body
{
height:100%;
}
A:link
{
background-color:#FFFFFF;
text-decoration: none;
color:#065c95;
font-weight:normal;
}
A:visited
{
background-color:#FFFFFF;
text-decoration: none;
color:#065c95;
font-weight:normal;
}
A:active
{
background-color:#FFFFFF;
text-decoration: none;
color:#065c95;
font-weight:normal;
}
A:hover
{
background-color:#FFFFFF;
text-decoration: none;
color:#000000;
font-weight:normal;
}
body
{
margin:0px 0px 0px 0px;
padding:0px;
color:#000000;
background-color:#ffffff;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:62.5%;
}
#topbar
{
background-image:url(http://engineering.tri-m.com/topbarbackground.jpg);
background-repeat:no-repeat;
background-color:#ec9c21;
color:#FFFFFF;
width:100%;
height:70px;
}
#navigation
{
background-color:#065c95;
color:#FFFFFF;
width:100%;
height:23px;
}
#links
{
background-color:#065c95;
color:#FFFFFF;
height:23px;
font-size:14px;
font-weight:bold;
padding-left:0px;
padding-right:0px;
}
#content
{
width:100%;
height:100%;
vertical-align:top;
}
#title
{
width:100%;
text-align:left;
padding-left:30px;
padding-top:10px;
padding-bottom:10px;
}
#bottombar
{
background-image:url(http://engineering.tri-m.com/bottombar.jpg);
background-repeat:no-repeat;
background-color:#de6926;
color:#FFFFFF;
width:100%;
height:70px;
}
#copywrite
{
width:100%;
height:12px;
background-color:#ffffff;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#000000;
padding:1px;
margin-bottom:0;
}
table
{
font-size:15px;
}
/* Headings */
h1
{
font-size:16px;
color:#065c95;
background-color:#065c95;
margin:0px;
}
/* Features Title */
h2
{
font-size:16px;
color:#f47720;
background-color:#f47720;
margin:0px;
}
/* Features */
h3
{
font-size:12px;
color:#065c95;
background-color:#065c95;
margin:0px;
}
/* Product Descriptions */
h4
{
font-size:16px;
color:#065c95;
background-color:#065c95;
margin:0px;
}
/* Product Descriptions */
h4
{
font-size:12px;
color:#f47720;
background-color:#f47720;
margin:0px;
}
/* Product Descriptions */
h5
{
font-size:12px;
color:#000000;
background-color:#000000;
margin:0px;
font-weight:normal;
}

Wow I'm really stuck here! :S Please could someone help me. :(

-Jacenta

Jacenta
04-10-2006, 05:11 PM
is anyone able to help me with this?