Corrected paragraph: So I then tried just the links and letting them run inline naturally without a <ul>. I adjusted for the now missing <li>s and I'm still getting odd breaks. I don't see WHY words *AREN'T* dropping down to another line when the appear to be able to. OR I get things dropping to another line when there is clearly enough room for it not to have to break.
Sorry. Thanks. On Fri, Aug 3, 2012 at 2:34 PM, Tom Livingston <[email protected]> wrote: > Sorry about the mis-fire, lets try again and finish the thought this time... > > > > Hello list, > > Having a situation and am not sure the best way to handle it. Can't > post a link, sorry. > > I have a group of links that I need to have sit next to each other like so: > > Link & more link text | Linkstuff | Link & more link text | > link | link |Link & more <--note the line broke here. this is > what i'm after. Natural breaks. > link text | Linkstuff | Link & more link text | link | link | Link > & more link text | Linkstuff > | Link & more link text | link | link | Link & more link text > | Linkstuff > > WHat i'm getting is: > > Link & more link text | Linkstuff | Link & more link text | link | > link > Link & more link text | Linkstuff | > Link & more link text | Linkstuff | Link & more link text | > link | link | Link & more link text > | Linkstuff | Link & more link text | link | link > > > I started with a <ul>, floated the <li>s and did some padding and > margin and added a border on the <a> to handle the rule to the right > of the links (like the pipe shown above). I added the rule to the <a> > so I could pad the <li>s for "line spacing" and not have tall rules > > The problem is when I have cases like "Link & more link text" the > <li>s ( i'm assuming it's the <li>s) won't let the text break where > you'd expect and wrap to another line so I end up with odd line > breaks. > > So I then tried just the links and letting them run inline naturally > without a <ul>. I adjusted for the now missing <li>s and I'm still > getting odd breaks. I don't see WHY words are dropping down to another > line when the appear to be able to. OR I get things dropping to > another line when there is clearly enough room for it not to have to > break. > > code: > > .discipline-sortlist{position: relative; width: 90%; margin: 0 0 1em > 0; padding: 0;} > .discipline-sortlist a{font-size: .875em; line-height: 1; > border-right: 1px solid rgb(95,95,95); padding: 0 6px 0 0;} > .discipline-sortlist a:first-of-type{margin: 0;} > .discipline-sortlist a:last-of-type{padding: 0; border: none;} > > <div class="discipline-sortlist clear"> > <a href="">General</a><a href="">Business</a><a href="">Criminal > Justice</a><a href="">Culinary, Hospitality & Tourism</a><a > href="">Economics</a><a href="">Education</a><a href="">Fashion</a><a > href="">Humanities & Social Sciences</a><a href="">IT & > MIS</a><a href="">etc...</a> > </div> > > I am not familiar enough with the various 'word-wrap" properties and > the like. Any help would be appreciated. > > TIA > > -- > > Tom Livingston | Senior Interactive Developer | Media Logic | > ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
