Jump to content
Sign in to follow this  
rainmaker

Text alignment with pagelines upgrade

Recommended Posts

rainmaker

When I upgraded to the latest version of Pagelines (1.3.1), some of my text formatting was affected. Basically anything that was in a table format (including my mappress / google maps / directions) all now have center text alignment, when it should be left alignment. I have linked a screenshot: http://www.screencast.com/t/ZMXsrXp8SDoes anyone know how I can fix this? What pagelines .css file is overwriting my mapquest .css file? I also noticed that any tables that have left alignment in the pagelines editor are also centered when I view it live.

Share this post


Link to post
Share on other sites
cmunns

A live link would help, but you could also familiarize yourself with FireBug to inspect the rule and change it back to `text-align:left;`

Share this post


Link to post
Share on other sites
avstrati

I have this issue as well. All my code says the correct info (I checked with firebug)

<tr>
	<td align="left" valign="middle" width="165">A</td>
	<td align="center" valign="middle" width="141">B</td>
	<td align="left" valign="middle" width="170">C</td>
	<td align="right" valign="middle" width="190">D</td>
	</tr>

But everything comes out centre aligned. I went to the theme.css file and found the code for the table, then copied it, made mods and pasted it into the custom codes section. My first attempt was to take away all of the text-align references all together but that made no change. I tried with text-align: inherit; but all aligned left, even if some of my code says right and centre. * Default Entry Table */ table {width: 100%;} .hentry table, #comments table {margin-bottom: 1em;} .hentry table th, #comments table th {font-weight: normal;padding: .3em;font-size: 1.1em; text-align: inherit;} .hentry table td, #comments table td {padding: .35em .6em; text-align: inherit; } .hentry table .label, #comments table .label{ text-align: inherit;} Is there any other snippets of CSS I should be adjusting?

Share this post


Link to post
Share on other sites
bryan-hadaway

There were some CSS styles added to handle tables a bit nicer for those who are using them although tables aren't highly supported anymore. 9/10 divs should be used instead of tables. In any case, pick up Firebug to inspect and style your pages: http://www.pagelines.com/docs/changing-colors-fonts Thanks, Bryan

Share this post


Link to post
Share on other sites
avstrati

Actually, I worked out my issue through trial and error. I have to use th instead of td.

<tr>
	<th style="text-align: left;" scope="row" width="27%">A</th>
	<th style="text-align: center;" scope="row" width="13%">B</th>
	<th style="text-align: center;" scope="row" width="30%">C</th>
	<th style="text-align: right;" scope="row" width="30%">D</th>
	</tr>

With the style sheet mods I suggested above, works perfectly!

Share this post


Link to post
Share on other sites
johnwake

Oh, man! I don't want to go in and change perfectly correct HTML because of quirk in a theme. Like I don't have enough to do!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×