How to make a text be justified ( maybe by using CSS) in a HTML page?

Hi Experts

Accordingly with the picture the text appears after a double click on the image

How to make the text be justified ( maybe by using CSS) - actually it passes the desired limit.

Thanks in advance
Eduardo FuerteDeveloper and AnalystAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Dave BaldwinFixer of ProblemsCommented:
That image shows that the element containing the text is too wide.  You need to set it's width to be the same as the background.
Julian HansenCommented:
Can we see your markup?

This appears to be a follow up question where you are adding the text by javascript (

We would need to see what that text is being added to in the context of the page and its styling.
Eduardo FuerteDeveloper and AnalystAuthor Commented:
Hello Julian

Yes, the code is presented by using jquery

CSS to display the buttons horizontally
<style type="text/css">
        #content {
        width: 1000px;
        margin: 0 auto 0 auto;
        display: inline-block;

   <img src="<?php echo base_url('xxxxxx/xxxx/testeira_compras-publicas_ica.png')?>" alt="xxxxx" title="COMPRASPUBLICAS"/>
            <div id="content">
                <img src="<?php echo base_url('xxxxxx/xxxx/botao_o_que_e.png')?>" id = "but1" alt="oquee" title="O QUE E" />
                <img src="<?php echo base_url('xxxxxx/xxxx/botao_pnae.png')?>"    id = "but2" alt="pnae" title="xxx" />
                <img src="<?php echo base_url('xxxxxx/xxxx/botao_ppais.png')?>"   id = "but3" alt="ppais" title="xxx"/>
                <p id="lowertext"></p>

Here the 'long text' that I want to fit in the width

            $("#but1").click(function() {
                    $("#lowertext").html('<p style="text-align:justify">Criado xxxxxxxxxx pelo meio da Lei xxxxxxxxde 2011, o xxxxxx x é uma ação do xxxxxxx que visa estimular a produção e garantir a comercialização dos produtos da agricultura familiar. O Programa faz com que o Estado se torne o principal comprador dos produtos da agricultura familiar, permitindo a melhora da qualidade de vida dos que trabalham no campo.</p>');       

            $("#but2").click(function() {
                    $("#lowertext").html("The second button was pushed.");

            $("#but3").click(function() {
                $("#lowertext").html("The third button was pushed.");

            $("#but4").click(function() {
                $("#lowertext").html("The fourth button was pushed.");

Open in new window

Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Eduardo FuerteDeveloper and AnalystAuthor Commented:
After a little seaching, it's just a matter of add this CSS code...

<style type="text/css">
p {
    max-width: 830px;

Open in new window

Julian HansenCommented:
That will work but if you are having to style width on a base element like <p> you probably need to relook at the design of your page.

Ideally elements like <p> should fill their containers - the container should define the width.

For us to be able to advise you we would need to see the page in context - either a link or a page dump of the html and css files.

While this may solve your immediate problem - doing it this way is risky as it could result in unexpected results when you add or change things in the future.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Eduardo FuerteDeveloper and AnalystAuthor Commented:
Thank you for your concerns!

I have limitations in disponibilize the page contents due the organization rules.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.