Site wide text width/ cut of words!!!
By Paul Murray on Thursday, 19 March 2015
Posted in Technical Issues
Likes 0
Views 693
Votes 0
Hi SI team.

This has had me baffled for some time!
If you go here:

http://finalbug.net/

there following sentence is divided into 2 lines:

final BUG is a unique network of film makers & post production specialist with one hoof in Berlin & the the other in the global vil

lage.

Which does not make sense.

Also here:

http://finalbug.net/blog/entry/397-v-o-d-training-for-fcpx-in-german

Here at final BUG we have the unusual situation where we post in English although we are based in Germany. So imagine our dilemma when training in Germ
an from Robin S. Kurz came on the market. There is precious little out there in the way of German training and if you happen to be German or can understand German then maybe this is for you. There is just something abo
ut the precision of the German language!

again here

http://finalbug.net/blog/entry/396-editing-a-documentary-in-fcp-x-part-03

Previously on Editing a documentary in FCPX we looked at boring but important stuff, Organising Projects, making Smart Colle
ctions, Analysing Clips and how to generally Manage Stuff. This time round we are looking at moving edit system in the middle
of the project. Pruning an overgrown project. Use of Proxies and Optimised Media. Xto7 and 7toX round tripping. The road not
traveled too Resolve. And in strange twist of fate that brought us back to 3 Way Colour Correction in FCP7. Which in all fairnes
s I always had a weakness for. It is after all based on the principles of a Da Vici Suite and if you ask me it is light years ahead o
f the Colour Board in FCPX which is just too square for my taste.

The words are getting cut off on the far right of the Blog posts and indeed on the home page!!!

Any thoughts would be appreciated as this is driving me nuts!

Ideally I would like no words cut off and be able to control the page width!

thanks for any thoughts

Paul
hey paul,
setting the text in the editor to justify each time would work in some instances but honestly that's a pain and not a solution to fit "everything".
even if this might work in some cases also think about times when others write a blog, you really want to instruct everyone to use that technique or have to manually edit everything so that the layout stays consistent - let me say: hell no, don't do that

personally I opt for giving my layout the pre-style I want everywhere, so users don't have to deal with it. perhaps (haven't checked all the places where you might run into the (non)justify issues) something very simple like 



#eblog-wrapper {

  text-align: justify;

}


added to your custom.css would do.

basically this tells that everywhere inside the eblog-wrapper id the text should be set to justify. that's a global solution and would apply everywhere except some other styles (joomla template, easyblog theme etc.) would overwrite it.
downside (in theory) is that if there are elements inside this id that you DON'T want to be justified then you can't use the global selector and would have to target them individually (that's what I said with the multiple elements you'd have to declare).
Alex
·
Thursday, 19 March 2015 20:58
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Paul Murray,

How are you?

I've checked in your 2 page as you provided, it seems like it didn't show out word cut off in my screen.

Check my screenshot : http://screen.stackideas.com/2015-03-19_1741.png || http://screen.stackideas.com/2015-03-19_1741_001.png

Am i missing something here? Please advise.
Arlex Wong
·
Thursday, 19 March 2015 17:42
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Arlex

I am fine thanks and you?

This is weird. Please see my screen shots which I made in Firefox!!!

I am wondering if it is a cache issue and if it could have something to do with the custom css file which I modified here?

/**

 * Here, you can define your own custom.css file.

 * This file will never be deleted.

 */

#ezblog-body .blog-text img, #ezblog-body .blog-content img {

max-width: 100%;

height: auto;

}



.bm-bann p {

text-align: center;

margin-top: 23px;

padding-bottom: 10px;

}



#bruce-bottom {

  z-index: 6;

  width: 500px;

  height: 25px;

  position: fixed;

  bottom: 0;

  left: 0;

}







#bm-bann {

  z-index: 12;

  width: 650px ;

  margin: 0 auto ;

}





#bm-outer {

  z-index: 12;

  width: 650px ;

  text-align: center;

}



#bm-inner {

  display: inline-block;

}



@media (max-width: 768px) {

  .customtop_banner_responsive img {

    width: 75% !important;

    height: 10% !important;

  }

  

  .custom_logo_responsive img {

    width: 15% !important;

    height: 10% !important;

      margin-top: -92px;

      margin-left: 45px;

  }

  

  .bm-bann {

    margin-left: 72px;

        margin-top: -114px;

  }

  

  

}



.navbar-main li {

  margin-bottom: 10px !important;

}


I changed:

max-width: 78%;


too

max-width: 100%;


If this is the case sorry for any confusion.
If this not the case then I am stumped!!!

best

Paul
Paul Murray
·
Thursday, 19 March 2015 18:02
·
0 Likes
·
0 Votes
·
0 Comments
·
hey paul,
the breaks are coming from your wanderers template. if you want to change that simply add the following line to your custom css file:



#eblog-wrapper .blog-text p {

    word-break: keep-all;

}
Alex
·
Thursday, 19 March 2015 18:42
·
0 Likes
·
0 Votes
·
0 Comments
·
Hey Alex

Thanks for jumping in here!
I applied the code as you suggested and it seems to help.
Some words are now separated with a dash!
Still seems a little odd to me!?!

Please see screen shot:

Here is my million dollar question.

Is there a way to get the text formatted the same way in all these three places:

http://finalbug.net/
http://finalbug.net/blog
http://finalbug.net/blog/entry/397-v-o-d-training-for-fcpx-in-german

As of now

http://finalbug.net/
Looks OK. Guessing that it is formatted “Justified”
http://finalbug.net/blog
Is formatted “Align Left”
http://finalbug.net/blog/entry/397-v-o-d-training-for-fcpx-in-german
Is formatted “Justified”

Would it not make sense to have every thing Justified and then simply centre all the photos on the Site?

thanks in advance

Paul
Paul Murray
·
Thursday, 19 March 2015 19:06
·
0 Likes
·
0 Votes
·
0 Comments
·
here is the attachment of Justified with dashes
Paul Murray
·
Thursday, 19 March 2015 19:08
·
0 Likes
·
0 Votes
·
0 Comments
·
hey paul,
for the dashes (also a current styling) try to use this code and replaced the other line I gave you before (it will extend it):



#eblog-wrapper .blog-text p {

  -ms-word-break: keep-all;

  word-break: keep-all;

  -webkit-hyphens: none;

  -moz-hyphens: none;

  hyphens: none;

}


that should overwrite all styles for the selector by the template.

for the different views / not justified layout: the main issue here is that the markup itself is not semantically done well, means some text is not in a paragraph while it should. having that said of course you can still get them justified anywhere. just select the element (in this case you have to do this with multiple one's) and then give them the value you like. question is more if this would make much sense right now where chances are high that with easyblog5 all /most styles will be changed and therefore your customizations won't work anymore and you have to do it again, but it's up to you if you want to do it 2 times now - just don't say you weren't warned ^^
Alex
·
Thursday, 19 March 2015 19:53
·
0 Likes
·
0 Votes
·
0 Comments
·
Hey Alex

First off way better with out the dashes.
Those couple of lines of code are a big help :-)

I understand that any formatting changes that I undertake per hand will be made obsolete with the arrival of EB 5!

So how about this I make the first page of the Blog “Justified” if need be, per hand.

you say:

just select the element (in this case you have to do this with multiple one's)


Are you referring to the individual Blog posts?

The thing that I am not getting is that if I go EB and the Blog post editor I have the Blog set to “Justified” and yet it turns up on the Blog list page as “Left Aligned”
Am I missing something.
Do I need more code or need to change something else in the back end?

After the “Justified” universal look (at least on the first page of the Blog) I put down my tools and go back to writing articles!!!

Looking forward to EB 5.
Just wish that the natives would not be so restless.
There is too much drum banging for my liking in the forums these days.

thanks

Paul
Paul Murray
·
Thursday, 19 March 2015 20:24
·
0 Likes
·
0 Votes
·
0 Comments
·
Hey Alex

OK. Think I have understood this about 90%
Not quite sure what the exceptions to the rule are!
But hell, it looks way 100% better at first glance and every thing is going to way better when EB 5 is out.
Well things might get worse before they get better but at least better within the next 6 months

many thanks

Paul
Paul Murray
·
Thursday, 19 March 2015 21:09
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi guys,

Thanks for the sharing. Have a nice day.
Yasser Ibrahim
·
Thursday, 19 March 2015 22:39
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Guys

One more thing.
Could one of you give me a line of code that would limit the width of the text to eg 600 pixels.
If it is better to do this as a percentage this is also cool.

This way I could get the width of the text to match the width of 90% of the photos on my Blog!!!

Will need to post another thread about a long term strategy for pictures for the Blog.
My main thing is that I live in a world where we have a thing called aspect ratio!
So for eg we talk about 4:3 or 16:9

i.e. in the long term what really matters for me is the ratio of the width to the height!!!

However this last line of code would keep me happy whilst I develop my long term photo strategy!
Maybe EB 5 is so good that I do not even need a strategy

Fingers crossed and thanks

Paul
Paul Murray
·
Friday, 20 March 2015 18:46
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Paul,

I am really sorry for the delay of this reply as it is a weekend for us here. Sorry but I don't quite understand what you are trying to achieve here. Can you please elaborate more on this please?
Mark
·
Saturday, 21 March 2015 18:14
·
0 Likes
·
0 Votes
·
0 Comments
·
Hi Mark & Team

I have changed my standard image size to 800px and am going to wait for EB5 before going insane

Thanks as always for the amazing support

Paul
Paul Murray
·
Tuesday, 24 March 2015 01:31
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Paul,

You are most welcome
Ezrul Fazwan
·
Tuesday, 24 March 2015 13:09
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post