• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2438
  • Last Modified:

Alignment of text in Dreamweaver CS4 using the properties panel icons

I have always been able to click on the "align" icons on the properties bar and move a paragraph to either left, center, etc without any other paragraph statements moving. On CS3 it was one properties bar. My basic template is 1 column liquid centered. Or I could just click on one of the align options and start a new paragraph in any of the align locations. Now, if I do that, all the paragraphs move. I have tried to apply different CSS rules, but it doesn't seem to matter. Do I need to setup a special rule in my code section? In past versions, I wasn't faced with this problem.

If I work in the html section of the properties bar, I can align paragraphs or start paragraphs from any of the align locations using the format>align command on the tool bar or the shortcut keys.

Shouldn't I be able to do the same using the CSS part of the properties panel and the alignment icons on it?

I am using Vista Ultimate 32-bit.
0
singleton
Asked:
singleton
  • 4
  • 3
1 Solution
 
Jason C. LevineNo oneCommented:
Hi singleton,

When you hit the align button in DW, is it affecting the HTML or is it creating CSS styles?
0
 
singletonAuthor Commented:
In CS3 HTML and CSS were together it changed the html, like:
<p align="center">line 1</p>
<p align="right">line 2</p>
<p align="left">line 3</p>

In CS4
Picture0001.png
0
 
singletonAuthor Commented:
In CS3 HTML and CSS were together it changed the html, like:
<p align="center">line 1</p>
<p align="right">line 2</p>
<p align="left">line 3</p>

In CS4 we can make the same changes from the dropdown menu in html mode, but when in css where we can see the align buttons it pops up a css rule like the above, and whatever you select affects all paragraphs
Picture0002.png
Picture0001.png
0
Cloud Class® Course: Microsoft Office 2010

This course will introduce you to the interfaces and features of Microsoft Office 2010 Word, Excel, PowerPoint, Outlook, and Access. You will learn about the features that are shared between all products in the Office suite, as well as the new features that are product specific.

 
Jason C. LevineNo oneCommented:
Okay.

>> In CS3 HTML and CSS were together it changed the html, like:
>> <p align="center">line 1</p>

That's not CSS, that's pure HTML :)  You probably had the Use CSS Instead of HTML box unset in CS3 preferences...

The Properties Panel has changed a bit oin CS4.  If you are seeing the alignment buttons, you are in the CSS mode of the Panel and thus using those buttons will send you to the CSS windows you see above.

The correct way to align a single element in CS4 is to right click it in design view and select Align from the context menu.  That writes the HTML align attribute.  Remember that align= is now officially deprecated.  The preferred method would be to create a class to handle the alignment and apply it as needed.
0
 
singletonAuthor Commented:
How in DW do you create a class, and then how do you apply that class to text. Ditto for IDs.

For example I would assume I should have

p#left { text-align: left; }
p#center { text-align: center; }

and in the html
<p id="center">
<p id="left">

or

p.left { text-align: left; }
p.center { text-align: center; }

and in the html
<p class="center">
<p class="left">

But how do I tell DW that this paragraph is supposed to be one of the centered ones, while this one is left flush, and most are justified.
0
 
Jason C. LevineNo oneCommented:
>> p#left { text-align: left; }
>> p#center { text-align: center; }

No, these are IDs and can only be used once per document.

>> .goleft { text-align: left; }
>> .gocenter { text-align: center; }

These are classes (I changed the identifier). Use would be:

<p class="gocenter">
<p class="goleft">

>> But how do I tell DW that this paragraph is supposed to be one of the centered ones, while this one is left
>> flush, and most are justified.

Select the paragraph and apply the class via the CSS properties panel.
0
 
singletonAuthor Commented:
The problem is in CS3 the icons used to be on a combined html/css menu and they worked to modify the html for that particular instance.

In CS4 they split html and css menus and the icons are only on the css properties screen, and they affect the global css settings.

In effect they are forcing true CSS usage on people, but not saying they did that.

But I might as well close this out, since there really is no solution to it
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now