Dynamic centering of text
# April 29, 2013 at 7:15 am
>how can I auto center the paragraph but keep text left justified?
Does not compute. You can’t ‘center’ and justify at the same time.
I’m not seeing the client’s problem to be honest. Is this a hyphenation issue or, perhaps a whitespace/word-wrap problem.
>If every post has different width
I don’t understand this either. Will the posts not be in containers with consistent widths?
If the client is **that** paranoid as to where sentences end then inline break tags are, I think going to be the answer.
I can’t think of any CSS/JS solution that could divine to the content, parse it out and insert styling (or whatever) to do this automatically.# April 29, 2013 at 7:23 am
Ohhh….it’s poetry, now I see (part) of the issue.
Don’t know if this is of use: http://thecampvs.com/formatting-poetry/
**please note that this article has been updated as noted **# April 29, 2013 at 7:45 am
This reply has been reported for inappropriate content.
On his old static site he controlled every post with margins and widths so the content is always centered. So I’m just trying to achieve some kind of auto centering css according to whatever the length of the sentences are for each poem.
Those links you showed look awesome bit I don’t know where to begin?# April 29, 2013 at 7:55 am
On looking through the various poems on the current site there doesn’t seem to be a consistent layout.
Some are left aligned: http://bullpen.no-masters-refuge.org/forty-fourth_time.html
Some centered: http://bullpen.no-masters-refuge.org/how_am_i.html
Some staggered: http://bullpen.no-masters-refuge.org/two_poems.html
Some are even numbered: http://bullpen.no-masters-refuge.org/suite.html
Is this important to the poet? I think the job might be bigger than you think.
If the post is to be centered regardless of poem layout then a JS solution would probably be required to calculated the widest content string and set a specific width to the post and then center it.# April 29, 2013 at 8:17 am
The `margin-auto` only works with a set width (or max-width) on the element…and that’s the one thing we don’t know.
>The client would have to use ul for all the poems?
I don’t know…but I think what you were after was a single (albeit flexible) solution for all the content. I’m unsure if the linked articles are precisely what you need but I think they offer a good jumping off point.
Basically, using the list is, realistically, a ‘hack’ used to avoid the necessity of extra `
` or `
` tags. I think it’s a reasonable solution but it’s never going to be semantic.
Whether some other element (heck even a table) would be better I don’t know.# April 29, 2013 at 8:53 am
@jknetdesign Are you asking how you can center the text horizontally with text being aligned to the left (which is by default)?
If you’re asking about justified text, well, I wouldn’t do that. Hyphenation isn’t supported in all browsers and when justifying text it’s important for hyphens to be in place. Otherwise words will have large gaps between them.# April 29, 2013 at 9:41 am
@chrisburton The issue is, AFAIK, is that there will be an elements (at the moment it doesn’t matter which) of unknown width to fit inside a div of ( I assume) a known width (or possibly 100%).
The width of the ‘child’ element will be determined by the longest string of content ( a line of verse). The content of the poem will. I believe, be left aligned but, if I am right, it may not matter.
He’s looking for a ‘universal solution’. Initially I was leaning towards pure JS but, without testing, the ‘Centering in the Unknown’ **might** offer a solution.
You must be logged in to reply to this topic.