Div scrollbar overlapping lower part of table

P

phl

Hello

I have div element and within it, I have a table. Basically I want to
use the Div to restricit the table to a certain width, and if it goes
over this width, the user is then presented with a scroll bar.
Everything works fine, except in IE7, when the table renders over a
certain amount of rows, and the Div displays the scroll bar. The last
row of the Table is obscured by the scrollbar created by the div. It's
almost like the div did not create extra height for the horizontal
scroll bar it displaying. The same problem does not happen in Firefox.
The below is the html, I am using:

<div style="width: 100px;overflow-y: hidden;overflow-x:
auto;position:relative;">
<TABLE width="100%" align="center">
<TR>
....
....
</TR>
</TABLE>
</div>

Can someone please explain whats going on and a possible work around?

Cheers
-P
 
A

Adrienne Boswell

Hello

I have div element and within it, I have a table. Basically I want to
use the Div to restricit the table to a certain width, and if it goes
over this width, the user is then presented with a scroll bar.
Everything works fine, except in IE7, when the table renders over a
certain amount of rows, and the Div displays the scroll bar. The last
row of the Table is obscured by the scrollbar created by the div. It's
almost like the div did not create extra height for the horizontal
scroll bar it displaying. The same problem does not happen in Firefox.
The below is the html, I am using:

<div style="width: 100px;overflow-y: hidden;overflow-x:
auto;position:relative;">
<TABLE width="100%" align="center">
<TR>
...
...
</TR>
</TABLE>
</div>

Can someone please explain whats going on and a possible work around?

Cheers
-P
Click to expand...

A URL would be really helpful. The markup shown may not be the cause of
the problem and there is no way to know without a URL.
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Thu, 09 Aug 2007 00:53:33 GMT
phl scribed:
Hello

I have div element and within it, I have a table. Basically I want to
use the Div to restricit the table to a certain width, and if it goes
over this width, the user is then presented with a scroll bar.
Everything works fine, except in IE7, when the table renders over a
certain amount of rows, and the Div displays the scroll bar. The last
row of the Table is obscured by the scrollbar created by the div. It's
almost like the div did not create extra height for the horizontal
scroll bar it displaying. The same problem does not happen in Firefox.
The below is the html, I am using:

<div style="width: 100px;overflow-y: hidden;overflow-x:
auto;position:relative;">
<TABLE width="100%" align="center">
<TR>
...
...
</TR>
</TABLE>
</div>

Can someone please explain whats going on and a possible work around?
Click to expand...

Sounds like an ie bug, but as Adriuenne said...
 
P

phl

Well bust mah britches and call me cheeky, on Thu, 09 Aug 2007 00:53:33 GMT
phl scribed:









Sounds like an ie bug, but as Adriuenne said...

--
Neredbojias
Half lies are worth twice as much as whole lies.- Hide quoted text -

- Show quoted text -
Click to expand...


OK, so here's the problem. the entire html is there:

<html>
<header></header>
<body>

<div style="width: 300px; height: 100px; overflow-x: scroll !
important; overflow-y: hidden ! important">
I am going forth with this tutorial even though it is second in the
poll results. The reason is that creating a

joomlafied template from an open source template is lot more
complicated and it takes me two days to make one

for my site with final touch so that it works fine in all common
browsers and everyone knows the crap IE.

http://www.joomlaprodigy.com/administrator/index2.php?option=com_content
</div>


</body></html>

how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Thu, 09 Aug 2007 22:48:10
GMT phl scribed:
how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
Click to expand...

That's simple. Use an ie conditional comment so that it only is read by
ie7.

<!--[if IE 7]>
<div><br></div>
<![endif]-->

....or whatever.
 
P

phl

Well bust mah britches and call me cheeky, on Thu, 09 Aug 2007 22:48:10
GMT phl scribed:
how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
Click to expand...

That's simple. Use an ie conditional comment so that it only is read by
ie7.

<!--[if IE 7]>
<div><br></div>
<![endif]-->

...or whatever.
Click to expand...


I have better description of problem here in code below. It shows the
table inside the div. This table will be created dynamically, so it's
not simple static content like the previous code. The only way I can
get IE not to overlap table text is to set the overflow-x style of the
div to scroll, but then this shows a greyed out scroll bar even when
it not needed. I guess the question at this stage is, is there some
way of geting IE to do this properly, without adding extra space, or
figuring out whether the scroll bar will appear before table is
generated, or do this from javascript after page has been renderd,
this will be the least desirable option as it's slow.

<html>
<header></header>
<body>


<div style="width: 300px; overflow-x: auto ! important; overflow-y:
hidden ! important">

<table border=1 width=100%>
<tr>
<td>
I am going forth with this tutorial even though it
</td>
<td>
is second in the poll results. The reason is that
</td>
</tr>

<tr>
<td>
creating a joomlafied template from an open source template
</td>
<td>
is lot more complicated and it takes me two
</td>
</tr>


<tr>
<td>
days to make one for my site with final touch
</td>
<td>
so that it works fine in all common browsers
</td>
</tr>

<tr>
<td>
and everyone knows the crap IE.
</td>
<td>
http://www.joomlaprodigy.com/administrator/index2.php?option=com_content
</td>
</tr>




</div>




</body></html>
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 00:37:20
GMT phl scribed:
how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
Click to expand...

That's simple. Use an ie conditional comment so that it only is read by
ie7.

<!--[if IE 7]>
<div><br></div>
<![endif]-->

...or whatever.
Click to expand...


I have better description of problem here in code below.
Click to expand...

No, you don't. That "code" tells me nothing. A url is required to see
the real problem although your markup indicates inaccuracy and
invalidity.
 
D

dorayme

Neredbojias said:
No, you don't. That "code" tells me nothing. A url is required to see
the real problem although your markup indicates inaccuracy and
invalidity.
Click to expand...

But so important is the quoted code that you quote it all over
again. Does the idea of editing a post not mean anything to you
unless your emotions are engaged?
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 05:56:18 GMT
dorayme scribed:
But so important is the quoted code that you quote it all over
again. Does the idea of editing a post not mean anything to you
unless your emotions are engaged?
Click to expand...

I quoted it only because I referred to it. You should try being less
critical, like me.
 
D

dorayme

Neredbojias said:
Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 05:56:18 GMT
dorayme scribed:


I quoted it only because I referred to it.
Click to expand...

If this is the criteria, then God help us all. You wrote to
dismiss all interest in it, not to refer to it for some useful
purpose evident in what you had to say. Getting this point or
shaping up to resist with your usual schmuckery...
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 07:44:50
GMT dorayme scribed:
If this is the criteria, then God help us all. You wrote to
dismiss all interest in it, not to refer to it for some useful
purpose evident in what you had to say. Getting this point or
shaping up to resist with your usual schmuckery...
Click to expand...

Well, I can see your opinionated side of things, but I simply followed the
rules. If you refer to something, you should quote it. What's the big
deal, anyway? If a few extra lines of text can upset your world, how
tentative that world must be.
 
D

dorayme

Neredbojias said:
Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 07:44:50
GMT dorayme scribed:


Well, I can see your opinionated side of things, but I simply followed the
rules. If you refer to something, you should quote it. What's the big
deal, anyway? If a few extra lines of text can upset your world, how
tentative that world must be.
Click to expand...

I told you ages ago the story about Travis' candidate for
President of a country that produced the Jazz musical form, 12
Angry Men, and some of the most interesting things on God's
earth, America! Yup, George Bush!

Now there is a schmuck, surely! And the story was about Peter
Singer's analysis of his arrested moral development. He had to
make a speech that was to be broadcast the following Saturday. In
the middle of the speech, he kept stopping and objecting at the
line that read "... and today I ..." because he thought this was
somehow lying! It was not Saturday already!

Jesus Christ!

You see, Boji, he learnt his moral rules like a parrot and had no
real understanding of them, what was important about them. He
never grew up properly. He drank too much and that is perhaps
what hindered his progress? I suspect, in his case, his
Christianity was an effect of a basic deep down problem rather
than the cause of it. Some Christians are quite sophisticated and
it takes skill to see through the best of them.

Since you are being not directly offensive to me, I will just
give you some advice. Examine the rules you follow and see what
is important about them, pick out the relevant bits and adapt to
situations. Try not to be a George.
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 08:43:35
GMT dorayme scribed:
I told you ages ago the story about Travis' candidate for
President of a country that produced the Jazz musical form, 12
Angry Men, and some of the most interesting things on God's
earth, America! Yup, George Bush!

Now there is a schmuck, surely! And the story was about Peter
Singer's analysis of his arrested moral development. He had to
make a speech that was to be broadcast the following Saturday. In
the middle of the speech, he kept stopping and objecting at the
line that read "... and today I ..." because he thought this was
somehow lying! It was not Saturday already!

Jesus Christ!

You see, Boji, he learnt his moral rules like a parrot and had no
real understanding of them, what was important about them. He
never grew up properly. He drank too much and that is perhaps
what hindered his progress? I suspect, in his case, his
Christianity was an effect of a basic deep down problem rather
than the cause of it. Some Christians are quite sophisticated and
it takes skill to see through the best of them.

Since you are being not directly offensive to me, I will just
give you some advice. Examine the rules you follow and see what
is important about them, pick out the relevant bits and adapt to
situations. Try not to be a George.
Click to expand...

Um, okay, I guess. I don't like GB, either, but I don't know if I can
attribute his failings to what you said. I think he's just conceited, a
bit of a power-monger, and even less altruistic than a "normal" person
with an inflated ego might be. It's like "Hooray for George, and what
peons...?" Public Service often is shucked at the top, and I think
Georgy boy is more interested in service to his family and peers than to
the overall citizenry of this country. What gets me, though, is I sat
there and watched much of his second election returns, and a majority of
the morons here did, indeed, vote for him. So much for the intelligence
of the American people...
 
P

phl

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 00:37:20
GMT phl scribed:






how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
That's simple. Use an ie conditional comment so that it only is read by
ie7.
<!--[if IE 7]>
<div><br></div>
<![endif]-->
...or whatever.
Click to expand...
Click to expand...
I have better description of problem here in code below.
Click to expand...

No, you don't. That "code" tells me nothing. A url is required to see
the real problem although your markup indicates inaccuracy and
invalidity.






It shows the
table inside the div. This table will be created dynamically, so it's
not simple static content like the previous code. The only way I can
get IE not to overlap table text is to set the overflow-x style of the
div to scroll, but then this shows a greyed out scroll bar even when
it not needed. I guess the question at this stage is, is there some
way of geting IE to do this properly, without adding extra space, or
figuring out whether the scroll bar will appear before table is
generated, or do this from javascript after page has been renderd,
this will be the least desirable option as it's slow.

<div style="width: 300px; overflow-x: auto ! important; overflow-y:
hidden ! important">
Click to expand...
<table border=1 width=100%>
<tr>
<td>
I am going forth with this tutorial even though it
</td>
<td>
is second in the poll results. The reason is that
</td>
</tr>
Click to expand...
<tr>
<td>
creating a joomlafied template from an open source template
</td>
<td>
is lot more complicated and it takes me two
</td>
</tr>
Click to expand...
<tr>
<td>
days to make one for my site with final touch
</td>
<td>
so that it works fine in all common browsers
</td>
</tr>
Click to expand...
<tr>
<td>
and everyone knows the crap IE.
</td>
<td>
http://www.joomlaprodigy.com/administrator/index2.php? option=com_content


</body></html>
Click to expand...

--
Neredbojias
Half lies are worth twice as much as whole lies.- Hide quoted text -

- Show quoted text -- Hide quoted text -

- Show quoted text -
Click to expand...

What a waste of time.
 
N

Neredbojias

Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 17:30:27 GMT
phl scribed:
how do you get the div to make space so the horizontal scroll bar does
not overlap the text in the bottom? I can just add space after the
content but this shows as extra space in Firefox or opera.
Click to expand...
That's simple. Use an ie conditional comment so that it only is read by
ie7.
Click to expand...

<!--[if IE 7]>
<div><br></div>
<![endif]-->
Click to expand...
...or whatever.
Click to expand...
I have better description of problem here in code below.
Click to expand...

No, you don't. That "code" tells me nothing. A url is required to see
the real problem although your markup indicates inaccuracy and
invalidity.
Click to expand...

What a waste of time.
Click to expand...

Precisely. That's why those who do not offer a url demonstrating their
problem are usually ignored, as should obviously have been the case here.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Having trouble centering contents of td ? 3
Help with code 0
How can I get my menu inside of a menu to function properly? 1
Please Help? 0
How to have two html audio players on one page? 0
Help with my responsive home page 2
<Button ...> display is fine, except for two things 1
two tier grid inside of a table 0

Members online

No members online now.
Total: 27 (members: 1, guests: 26)
Robots: 460

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top