Text with scroll in severel resolutions

I have a text area at my site.
This site has a menu bar in the left and in the centre is that text area.
In some resolutions of the screen there is a horizontal scrollbar for the text.
Is there a way with css to “disappear” this scrollbar ?

A link would be nice.

But i’ll guess that you have fixed dimensions set for that “text area” and that is almost certainly the problem.

Yes, also there is a “subdiv” having some text in some pages…with fix width/height.
So there is no way,maybe to have smaller font-size.

I suppose that you could use media queries to detect screen size and scale text accordingly, but that’s just weird.

I would advise you to take a step back and review your layout and find a solution that doesn’t require, at least, for that text container to have a fixed height.

Once again if you could provide a link to your work, it would be a lot easier to give suggestions.

The work is not ours.
But the client ask us to give bigger width at the layout for this.
For example this maybe have horizontal scrollbar (the text at the center) at some resolutions…

HI,

You could hide the horizontal scrollbar for most browsers like this:


.content_text_submenu {
overflow: auto;
overflow-x:hidden;
}

Of course it will be up to you to decide whether that causes content to be clipped or not.

Well it really boils down to this: either the container stretches to fit the content, or the content is tailored to fit the container.

I strongly advise against changing font-size based on screen size. Giving smaller text to users with smaller screens is not a proper solution.

Yes as said above you should not rely on having the text small just so that you don’t get a scrollbar.

The size of text is unlikely to be the issue that a scrollbar appears anyway and the culprit is usually that when the vertical scrollbar kicks in it steals some real estate from the fixed width div and thus causes the horizontal scrollbar as well.

You should nest an inner div inside the overflow div and make it about 20px approx smaller than the parent to allow a scrollbar to pop in and out easily.

However, I didn’t notice a horizontal scrollbar on that layout even when zooming text right up.