Help with some HTML

[stick2Herbs]

Hi guys, I'm having some trouble with basic HTML.

I am attempting to put a dotter border + bacground


Heres the code:

<p style="border:4px dotted OrangeRed;background-color: #FFCC33;"><b>MY TEXT HERE</p>

Now, if I do it like that, its fine and works perfectly.


But the moment I do this

<p style="border:4px dotted OrangeRed;background-color: #FFCC33;"><b>MY TEXT TEXT TEXT TEXT TEXT

BLAH BLAH BLAH BLAH MORE BULLSHIT

SOME MORE TEXT</p>

Basically, I can't have 2 lines double spaced . It only works when its one link like above.


I'm fairly new to HTML but everythings been pretty simple and straightforward except this... and its pissing me off haha:angryfire: But I'm probably just retarded

Thanks and goodnight!

 

[utterdomain]

couple of things.

1. a "b" tag without a closing "b" tag is invalid
2. html doesn't respect your white space. If you want a "hard return", then you need to either use a "br" element or if you want you could put your multiple paragraphs (p tags) inside a single div element. Then just put the styling on the div element so that the border is around all of the paragraphs.

I hope this helps.

 

[pickledegg]

Or something like this:

p {
 line-height:1.5em;
}

 

[fixie]

OrangeRed

*shivers*

<p style="border:4px dotted OrangeRed;background-color: #FFCC33;"><b>MY TEXT TEXT TEXT TEXT TEXT

BLAH BLAH BLAH BLAH MORE BULLSHIT

SOME MORE TEXT</p>

First, you need to close <b> tag with </b>

I assume you are trying to cut it into more lines. You will want to use <br /> where you want your line to cut off and go into another row. Try to avoid it if you can.

What I recommend is this (well, since you already use inline style, i would have done it differently, with external css file or with css in head part of the html file):

<div style="border:4px dotted OrangeRed;background-color: #FFCC33; padding:5px;">

<p style="padding-bottom:1em";><b>MY TEXT TEXT TEXT TEXT TEXT</b></p>

<p style="padding-bottom:1em";>BLAH BLAH BLAH BLAH MORE BULLSHIT</p>

<p>SOME MORE TEXT</p>
</div>

I assume you want something like this. If that's not what you meant, pm me and I will show you in detail.

Edit: damn, already beaten to it

 

[kblessinggr]

The seperate css code:

<style type="text/css">
/* ... some of your other stuff here ... */
.borderred p { font-family: Helvetica; font-size: 14px; line-height: 18px; margin-bottom: 25px; text-align: left; width: 100%; }

.borderred h3 { font-family: Helvetica; font-size: 18px; line-height: 20px; margin-bottom: 20px; font-weight: bold; width: 100%; }

div.bordered { border:4px dotted OrangeRed; /* OrangeRed... seriously? */ background-color: #FFCC33; padding: 5px; }
</style>

Then course your text:

<div class="borderred">
<h3>My Bolded Text</h3>
<p>BLAH BLAH BLAH BLAH MORE BULLSHIT</p>
<p>SOME MORE TEXT</p>
</div>

 

[stick2Herbs]

I have given out to much rep in the ast 24 hrs

Thanks for the help guys, and normally I remember to close the <b> tag but it was like 4 AM.

Thanks again, appreciate the help!

 

[medicalhumor]

the <b> tag is a bit outdated.

<strong></strong> is preferred, or, just style the text like the others have mentioned

 

[teamversion]

w3schools is a good resource for this. if you want html and wordpress there's htmlpress.

 

[priya12]

w3schools
is a good resource for this. if you want html and wordpress there's htmlpress.

dont use color name use color code ie hexadecimal for eg#000000 for black

 

[paystolivegreen]

Yeah, why not just use stylesheets when you are already using styles on the p tag. Also, try going to div's instead of p tags. I would also recommend using an external stylesheet instead of in-lining them within the tag.

 

[sousen]

You can follow this W3Schools Online Web Tutorials it's very Good site when I face any problem I go there and I always happy with there support

 

[Navuud]

In addition to all the above posts, I also recommend downloading an addon for firefox called firebug, with it you can highlight any part of the site and it'll bring up the scrip in a nice neat box at the bottom, you can change anything there to see what it would look like with the changes then if you like em do it permanently in editor or whatever you're using. A much easier way to test the waters, especially if you're new to HTML and whatnot..

Good luck