PDA

View Full Version : How to insert links into one row?



Metalpalo
01-07-2010, 12:08 PM
Hello

I have got list of links and I need to insert them into one row in DIV element.
I use float:left property for them but in case of small width the links are shown in more than one rows.

How can I do it?

Thanks

jscheuer1
01-07-2010, 05:30 PM
This is sort of odd. I'm not certain what you mean. But I think you have like not enough space inside the division. I mean, even if the division takes up the entire width of the page, in a narrow window that might not be enough. The fact that content will wrap if there is not width enough for it can be an accessibility issue, and/or a determining factor in whether or not your page has a horizontal scrollbar. Speaking of horizontal scrollbars, one solution would be to allow the division to have a horizontal scrollbar (overflow auto) if there isn't enough room for the links. But you wouldn't want to float the links then, they could still wrap. Links should be display inline anyway (their default display mode), if the height of the division is constricting, it's overflow auto and its white-space set to nowrap, it should work out, ex (the width is arbitrary, it need not be used, that way the division could expand as far as it can in the layout, only having a scrollbar if necessary):


<div style="height:2.336em;width:12.5em;overflow:auto;white-space:nowrap;">
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
</div>

Why are you trying this? Do you have a scroller/marquee or something?

If you want more help we would need to see the code or have a link to the page.