By kevlaa on

Dreaded Internet Explorer, I have been working on a website and I thought id give Drupal ago and so far looking great folks really good to work with.

As I always use firefox I decided to test the bits I have done in IE only to find as per usual it doesn’t work correctly this might just have something to do with Microsoft not having something called STANDARDS.

Anyhow the nodes (or content on the pages) that have been published using full html or php appear half way down the page in IE only. Anyone got any idea on how to sort this!!! It’s based on the greenmarinee theme.

If you really must look at it in IE you can find it at http://www.merchantglobal.com/

Try the about us page as an example

Many thanks

Kevin

Comments

kevlaa’s picture

kevlaa commented

Many thanks to the guys at Goodbasic:

Cut from Goodbasic.com:

Drupal Theme Fix
Submitted by Jarrod Piccioni on April 20, 2005 - 8:53pm.

I've been playing around with Drupal theming the past few days and have encountered more than a few problems when dealing with Drupal's built-in style and formatting rules. Specifically, when building or modifying a layout in Drupal, you may find that on some pages, the content is forced down below the sidebar, leaving a huge space on some of your pages. This appears to be caused by some built-in Drupal style elements which make form elements too wide, causing them to be pushed down on the page. The following has fixed this for me, however it only applies to the PHPTemplate templating engine:

- Wrap the content call print($content) in it's own DIV, I called
mine "stuff";
- Add this to the bottom of your CSS file:

/* Fixes many Form Elements */
.form-item input.form-text,
.form-item textarea.textarea,
.description {
width: 85%;
padding: 0;
}
.form-item select {
width: auto;
}
.box .form-item select {
font-size: 0.8em;
}
.user-login-block .form-item input {
width: auto;
}

/* These "more" links are problematic for left-aligned sidebars */
.more-link {
display: none ! important;
}

/* For administrative pages, keeps the tables from growing too wide */
table {
font-size: 0.8em;
letter-spacing: -0.1em;
}
th { letter-spacing: normal ! important; }
table strong { letter-spacing: normal ! important; }
.node table {
font-size: 1em;
letter-spacing: normal;
}

/* Code specifically for the search pages */
#searchform {
margin: 10px auto;
padding: 5px 3px;
text-align: center;
}

#searchform #s {
width: 100px;
padding: 2px;
margin: 0;
}

#searchform #searchsubmit {
padding: 1px;
margin: 0;
}

/* Keep that content where it should be */
.stuff {float: left; }
.attachments { width: 85% ! important; }

This should not only shrink up the form elements on all pages
throughout Drupal, but also float the actual page content to the left,
ensuring it's not pushed down too far on the page. This may not work
on all layouts that use floats for positioning, however it seems to
work on the fairly standard 2-column layout which uses a large right-
or left-hand margin and a single float to position the content
alongside the sidebar. Of course, read over the code before implementing it, you don't want to mess up your layout floating something where it shouldn't be floated.

Many thanks for a lot of the code goes to Chrisada Sookdhis, whose Drupal theme check-list has helped me immensely with the recent theme-work I've been doing.