/    Sign up×
Community /Pin to ProfileBookmark

scrolling a table in IE6 ain’t workin’

Hi folks. Here’s my problem. I want to put a table inside a div, then set the height of that div to be shorter than the table, and then set the div property to overflow:scroll; so that the table will be scrollable. It works fine in FF, however, it doesn’t work at all in IE6. You can see exactly what I’m talking about at [URL=”http://www.jontakiff.com/Stockabeetest/ideaboard.html”]http://www.jontakiff.com/Stockabeetest/ideaboard.html[/URL]

The markup is just a table inside a div, with the div styled like this:
#ideaDraftScroll {
height:100px;
overflow-y:scroll;
}

<div id=”ideaDraftScroll”>

<table width=”315″>
<tr>
<td>
Subject</td>
</tr>
<tr class=”tableOdd”>
<td>
<a href=”#”>Shorting the market</a> </td>

<td><a href=”#”>Delete</a></td>
</tr>

<tr>
<td>
<a href=”#”>Lehman Brothers</a> </td>

<td><a href=”#”>Delete</a></td>
</tr>

<tr class=”tableOdd”>
<td>
<a href=”#”>Something about something</a> </td>

<td><a href=”#”>Delete</a></td>
</tr>

<tr>
<td>
<a href=”#”>Lehman Brothers</a> </td>

<td><a href=”#”>Delete</a></td>
</tr>

<tr class=”tableOdd”>
<td>
<a href=”#”>Something about something</a> </td>

<td><a href=”#”>Delete</a></td>
</tr>
</table>

</div><!–end IdeaDraftsScroll–>

to post a comment
CSS

10 Comments(s)

Copy linkTweet thisAlerts:
@FourCourtJesterOct 07.2008 — Hey there,

upon opening the document in IE, I immediately got some null javascript errors. It looks to be in your demo.js file (looks like ajax?) in regards to a 'myVerticalSlide' . Could be the source of your troubles.
Copy linkTweet thisAlerts:
@johnnyblotterauthorOct 07.2008 — thanks, I see that but it's unrelated. I think scrolling a table in IE6 requires a sophisticated fix from what I've been reading.
Copy linkTweet thisAlerts:
@FourCourtJesterOct 07.2008 — Be that as it may, I have IE7 at work here, and it still doesn't work. I'll see what I can find out though ?
Copy linkTweet thisAlerts:
@FourCourtJesterOct 07.2008 — This works for me in IE7. Your page linked to me does not work in IE7. I still maintain it has to do with your ajax ?

<i>
</i>&lt;html&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div id="container" style="border:1px solid blue; height:100px; width:500px; overflow:scroll;"&gt;
&lt;table id="myTable"&gt;
&lt;tr&gt;
&lt;td&gt;Foo bar Maloo&lt;/td&gt;
&lt;/tr&gt;
&lt;!--Repeated 20 times--&gt;
&lt;/table&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@FourCourtJesterOct 07.2008 — Hi again,

Extensively going over the issues with IE7 (since I don't have 6), i see a very big difference in FF3 vs. IE7 for your IdeaAttach box. The IdeaAttach box, in Firefox, doesn't interfere at all with anything (although I have no idea why it has a left-margin of 400px), but in IE7, the IdeaAttach box is much bigger, and is forcing the IdeaDrafts up, which is screwing around with your box. It may be worthwhile looking into those differences to see if thats the root.
Copy linkTweet thisAlerts:
@johnnyblotterauthorOct 07.2008 — nope. just had something to do with one of my table elements set to position:relative;

seems solved for now - thanks for the heads up bout the errors though
Copy linkTweet thisAlerts:
@johnnyblotterauthorOct 07.2008 — Take a look now - both pages are nearly identicial in IE6 and FF3...let me know if looks good for you in IE7....

http://www.jontakiff.com/Stockabeetest/ideaboard.html
Copy linkTweet thisAlerts:
@johnnyblotterauthorOct 07.2008 — yes and that margin left for IdeaAttach is unnecessary...I don't remember why I even had that in there...
Copy linkTweet thisAlerts:
@FourCourtJesterOct 07.2008 — Looks good in IE7 now ?
×

Success!

Help @johnnyblotter spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...