Win a copy of Murach's Python Programming this week in the Jython/Python forum!
  • Post Reply Bookmark Topic Watch Topic
  • New Topic

IExplorer and general troubles... like loss of sanity.  RSS feed

 
Daniel Prene
Ranch Hand
Posts: 241
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I've been working hard on a jsf powered project manager and am running into some problems with IE compatability. I got everything aligned and positioned the way (more or less) I wanted it, but when I tested it against IE all hell broke loose (specifically with the dateInput component). I took a few screen shots to explain my problem...

What it looks like in Firefox: http://img6.imagepile.net/img6/91064firefox.png
What it looks like in IE: http://img6.imagepile.net/img6/76581ie.png
Each div outlined for refrence: http://img6.imagepile.net/img6/77815sh.png

(keep in mind the design is still in development)

CSS:


JSF Code:



The main focus: getting the inputDate working, the border around the container stretching, and not have one div fall beneath another or overlap when the window is resized.

Any help would be endlessly appreciated. Thank you!
 
Richard Green
Ranch Hand
Posts: 536
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
search for "IE css hacks" in google you will find plenty of them. Here are few of them:



also see http://www.noscope.com/journal/2005/01/showing-css-to-ie-only-the-underscore-hack

there are plenty of css hacks around - but the bottomline is IE is a pain in the ass when it comes to web standards. Anyone who has done some web designing/programming will realize how pathetic IE is.

use the above hacks and i am pretty sure u can solve ur problem.
 
Richard Green
Ranch Hand
Posts: 536
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
u might get better responses if you post this in a css forum (experts-exchange.com or tek-tips.com)
 
Daniel Prene
Ranch Hand
Posts: 241
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for the help...

I got everything working with:

body {
padding: 1em;
font-family: georgia, times, "times new roman", serif;
color: #000;
}

img {
border:0px;
}

.container {
width: 1000px;
margin: 0 auto;
border: 1px solid #333;
}

.banner {
border-bottom: 1px solid #333;
}

.banner h1 {
margin: 0;
padding: .5em;
}

.side {
width: 400px;
float: right;
padding: 1em;
overflow: auto;
height: 400px;
}

.sectionHeader {
text-align: center;
padding-bottom: 1em;
}

.side p {
margin-top: 0;
}

.content {
position: absolute;
padding: 1em;
overflow: auto;
height: 400px;
}

.content h2 {
margin-top: 0;
}

.footer {
clear: both;
background-color: #666;
text-align: center;
}

.pageHeader {
text-align: center;
padding-top: 1em;
}

Forgeting a doctype also messed some stuff up...

but I am still having trouble with my calander popup... Any idea?
 
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!