Preformatted text

HTML & CSS
1

Hey guys,

I’m having a few problems with preformatted text in that it is not behaving as you would expect it to. For example, if it is laid out as below it is fine:

<pre>
This is preformatted text
It works just fine
</pre>

However, when I need it to appear further indented into the page as below, it looks messed up and I have to do this to correct:

<pre>
This is preformatted text
It works not so good!
</pre>

A really silly problem that has cost me far to much time :frowning: Can anyone help?

thanks

Will

2

How are the examples you posted different? They look the same to me. :frowning:

<pre>
This is preformatted text
It works just fine
</pre>

<pre>
   This is preformatted text
   It works just fine
</pre>
3

<pre> is a block element. Simply give it a left margin.

cheers,

gary

4

Thanks very much Gary, that makes a lot of sense. :slight_smile:

5

Hey I definitely don’t know whats going on here so heres the link anyway guys, the pre element is styled with text-align:left to override a previous style rule and the font has been changed to arial:

Also when I try to make some of these words bold even stranger things occur :frowning:

6

Why are you using the PRE for ‘Company Directors’, it doesn’t make much sense especially since you aren’t using a fixed width font.

7

pre spacing only works with fixed width fonts! :cool:

8

Hey,
Thanks guys I wasn’t aware of the monospaced fonts but it still doesnt work and I have just figured out why.

Dreamweaver is not indenting the lines with the same number of spaces that a regular notepad text editor does. It is some evil little setting on dreamweaver which is causing the text to look messed up. Here is a test I just did:

www.pembrokechiro.co.uk/test.htm

On CS4 that appeared correctly lined up and indented!

Does anyone know what is happening? Is there some auto-indent property that I can switch off?

9

The text is not properly spaced in the original!

10

I’d suspect one of them is actually using TAB spaces by the looks of things.

11

Hey thanks everyone for your input, I am aware that the source and the result are the same, I am past that problem, what I am asking is if anyone knows if there is a setting in Dreamweaver CS4 which makes it space out elements just as ay other notepad editor would,
thankyou

12

I’d assume there is a code format setting within DW by selecting Edit> Preferences. In the Preferences dialogue box, select the Code Format category. Then get fiddling with the values as appropriate.

However, if you have ‘copied and pasted’ those characters you might need to do a Find and Replace of any tab characters already inserted to remove them.

13

Hey thanks very much for you input everyone,
A simple problem but no I have a handle on it :slight_smile: