Re: Define <br> by CSS means?

Am 21.07.2012 um 13:29 schrieb Dennis Amrouche:

> 
> Am 21.07.2012 um 09:31 schrieb Simon Sapin:
> 
>> Le 21/07/2012 07:30, Andrew Fedoniouk a écrit :
>>> Let's say we have this markup:
>>> 
>>> <div>
>>>  <span>1</span>
>>>  <span>2</span>
>>>  <span>3</span>
>>>  <span>4</span>
>>>  <span>5</span>
>>>  <span>6</span>
>>> </div>
>>> 
>>> and the desire to see these spans broken into two lines:
>>> 123
>>> 456
>>> 
>>> with div style defined as:
>>> 
>>> div { max-width: max-content; border:1px solid; }
>>> 
>>> so its width will be set set to max of widths "123" and "456".
>>> 
>>> Of course we can use <br> in markup between 3 and 4 but it is not CSS-ish.
>>> 
>>> Something like this:
>>> 
>>> div>span:nth-child(3) { line-break:after; }
>>> 
>>> probably?
>> 
>> 
>> Hi Andrew,
>> 
>> You can do as Lea said to have something behave like <br> in CSS. In fact that’s how <br> is implemented in some UAs.
>> 
>> Also note that in your markup, there is whitespace before and after each <span>. So you will most likely get the max width of "1 2 3" and "4 5 6". I’ve seen work arounds like this:
>> 
>> ...</span><!--
>>  --><span>...
>> 
>> -- 
>> Simon Sapin
>> 
>> 
> 
> Hello,
> 
> I dont know the usecase of Andrew.
> 
> But I would like to put into game, that within these spans you assumingly have originally put some text content (here its your numbers 1,2,3,4,5, etc).
> 
> whats wrong formatting text content with a break in the html-markup, semantically defined within a paragraph?
> 
> Is "CONTENT" here seen as "LAYOUT"??
> 
> // --> Please, stick to the concept of seperating content and presentation in those situations.
> 
> 
> If it is "LAYOUT" your are speaking of and seeing this where the problem originates from, then those objects you put now into a span, would be wrapped within a div, because its presentation.
> Then these divs you could let float, and on the third element, where you want the break happen, you would stop the flow with a float:none.
> 
> Dont be cleaner than clean... just in order of some technical fetish.
> 
> I feel totally unsafe with workarounds Simon suggested.... we wanted to minmize mark up right? Why put in there comments to prevent a white space?
> 
> With these inner elements floating, as I have described, you wont have a white space problem at all... the float is neutralizing/terminating the white space fill up at the end of each tag.
> 
> Your feedback and thoughts are welcome....
> 
> 
> Cheers
> Dennis
> 


My approach would be rather old school... here it is written as code:

<p>123<br>456</p>

Cant be more minimzed right?

And putting in there some dynamic text wont hurt either ... as long as you are in control of your back end processing...

I dont see what you cant do with this code, what you cant archieve with yours ...

In your markup example I would work with floats.... easy, simple and hard to break ...


Cheers
Dennis

Received on Saturday, 21 July 2012 11:40:29 UTC