Arraying
Arraying

Reputation: 179

HTML paragraph width not working

I have the following problem: I have set the width of a paragraph, but it doesn't seem to have applied.

<p style="">
    <center><img src="img/Arraying.png"></center>
</p>

<p style="max-width:500px;"><font size="+2"><center><b>Arraying: Web & Java Developer.</b></font>
    <br>
    <i>Hey, I'm Arraying. I'm the web and Java developer for Minevelop. My specialities are small, yet complex Spigot plugins, web development, and plugin configuration.
                        <br><br>I've been server managing since I was eleven or twelve, and over the years I have gained a lot of experiences.
                        <br><br>Spigot: https://www.spigotmc.org/members/_wiildanimal_.81436/ 
                        <br>Enjin: http://www.enjin.com/profile/9844615
                        <br>Email: [email protected]</i>
    </center>
</p>

<p style="">
    <br>
    <br>
    <center><img src="img/DomThePotato.png"></center>
</p>

<p style="max-width:500px;"><font size="+2"><center><b>DomThePotato: Lead Java Developer.</b></font>
    <br>
    <i>Hello, my name is Dom, aka DomThePotato, and I am the lead Java developer here at Minevelop. I specialise in utility plugins and everything that is not minigames. With over 1 and a half years of experience, I will be able to get any request done! Also experienced file configurer and backend administrator.
                        <br><br>Spigot: https://www.spigotmc.org/members/domthepotat.38275/
                        <br>Enjin: http://www.enjin.com/profile/7005362
                        <br>Email: [email protected]</i>
    </center>
</p>

The first paragraph about Arraying seems to work fine, yet the one about Dom just doesn't want to be 500px wide.

I'm really tired, so if the error is completely stupid please forgive me.

Upvotes: 2

Views: 28970

Answers (3)

Will
Will

Reputation: 111

As @Hans Strausl mentioned, your HTML tags aren't nested properly (I believe you want the <center> tag to wrap the <font> tag, but you can always reverse them again if I've misinterpreted). Also, changing the <p> tags to <div>s seemed to achieve what you're looking for.

Here's a fiddle. https://jsfiddle.net/wzazrn5p/

Upvotes: 0

Emma Earl Kent
Emma Earl Kent

Reputation: 578

The issue is with the way your html is structured. Both

tag and tags are inline elements. If you want to make all of the elemnts withing the

tag stay in a max-width container, then you should try changing the

tag to a tag.

Your code would look like this:

<div style="max-width:500px;"><font size="+2"><center><b>DomThePotato: Lead Java Developer.</b></font>
<br>
<i>Hello, my name is Dom, aka DomThePotato, and I am the lead Java developer here at Minevelop. I specialise in utility plugins and everything that is not minigames. With over 1 and a half years of experience, I will be able to get any request done! Also experienced file configurer and backend administrator.
                    <br><br>Spigot: https://www.spigotmc.org/members/domthepotat.38275/
                    <br>Enjin: http://www.enjin.com/profile/7005362
                    <br>Email: [email protected]</i>
</center>

Upvotes: 0

Hans Strausl
Hans Strausl

Reputation: 615

You are using max-width I think you need to just use width:

<p style="width: 500px;"> HTML </p>

Upvotes: 3

Related Questions