Aligning Text in Pages (hours, prices, phone numbers, etc)

  • chievresfmwr · Member ·

    Here’s an example of the problem I’m having
    http://usagbeneluxfmwr.wordpress.com/army-community-service/information-and-referral/

    As you can see, the hours of operation and phone numbers aren’t aligned. I’ve tried to insert a table, but the line spacing isn’t right. I’ve searched and fiddled for hours and can’t get the tables to single-space.
    What I want to do is set a tab, the way one does when using Word or another word processing program.
    I don’t have the option to install plugins.

    Thanks much in advance for whatever assistance or enlightenment you can offer.

    The blog I need help with is: (visible only to logged in users)

  • justpi · Member ·

    Before answering your actual question, I should note that there’s much redundant or useless code in this page. For example, you’ve got this:
    <h4 style="text-align:left;"><span style="color:#ffffff;"><em><strong>Chievres/SHAPE</strong></em></span></h4>
    First, on the theme you’re using, h4 headings are left aligned and italicized by default, so the text-align rule and the em tags are superfluous. Second, the span tag is used to style some of the content of a text block; when you want to change the whole block, you add the rule to the opening tag of that block. So, if you had to do this in the Text editor, it should be:
    <h4 style="color:#ffffff;"><strong>Chievres/SHAPE</strong></h4>
    Or, better:
    <h4 style="color:#ffffff;font-weight:bold;">Chievres/SHAPE</h4>
    But! You have the Custom Design upgrade. So you don’t need any of this. If you generally want your h4 headings that way, you specify it once for all in the CSS editor (and use plain h4 tags in the Text editor): 

    .entry-content h4 {
    color: #ffffff;
    font-weight: bold;
}
  • justpi · Member ·

    Now, HTML isn’t a word processor, and a webpage isn’t a piece of paper: you cannot just set “tabs”. The closest you could do is create CSS classes that have specific widths, and use these classes in the Text editor. But there’s no need to do this, since you already have the other tool you mentioned. I suggest you start by studying my table tutorial:
    http://wpbtips.wordpress.com/2013/04/09/table-coding-for-wordpress-com-users/
    You can create a test page to experiment till you get things right then transfer the content to the page you linked to. Don’t forget what I pointed above: if you generally need tables for this purpose only, you can add most of the necessary styling once for all in the CSS editor.

    “can’t get the tables to single-space”
    ? The content of a table cell is just like any other block: in the “Text” editor, you add a line break by pressing return. In case there’s a misunderstanding, you don’t need separate cells for items such as “Phone Numbers”, “DSN”, “Within Belgium” etc: all five items can be inside the same table cell.

  • The topic ‘Aligning Text in Pages (hours, prices, phone numbers, etc)’ is closed to new replies.