I know this has been posted several times in the forum and I've tried every suggestion offered but still I'm unable to center a table in a page. I've tried every suggestion in the forum and outside the forum - HTML, HTML plus CSS, wrapping table in a div plus CSS etc. Still the table sticks like glue to the left. Can anyone help me to solve this? I'm using Atahualpa 3.6.1, Classic theme edited. URL: http://www.webspotdesign.co.uk/?page_id=8

Just fixed it. Couldn't get div id and css to work but by simply putting <div align="center"> as a single line of code above the table and the closing </div> at the bottom, it works (only testing in Firefox). Bizarre. Not sure what's going on here, I think Atahualpa must over-ride or ignore some css code - even it's own inserts which are supposed to over-ride the built-in css?

Atahualpa just builds the page, the browser applies the CSS

Why are you using a <th> for one of the images in each row instead of a <td>?

Thanks for responding so quickly. Appreciate it. I made an empty table in Dreamweaver and copied and pasted the html - so Dreamweaver must have put it in. Will it cause problems?

a <th>defines a header cell and you are using it as a data cell. Who knows what it might do eventually. You need to be careful using something like DreamWeaver to create something and then just dropping it in to a pose. You should see what happens if you just do a copy/paste from a styled Word document - disaster

also if you have

<div align="center">

that doesn't equate to a CSS 'text-align:center' you need to use 'margin-left:auto; margin-right:auto'.

one other thing, if I click on one of the design's I get a small image. you should set it up so I can see a large version of the image, after all, if I'm looking at one of your designs, I actually want to be able to see it.

"you need to use 'margin-left:auto; margin-right:auto'."

Yes I tried that, it doesn't work. Neither does:

<table style="width: XXXpx; margin: 0 auto;">

Just tried again with:

html:

<div id="table1">
....my table here...
</div>

css insert:

#table1 {
margin-left: auto;
margin-right: auto;
}

Didn't work. Can you see anything wrong here?

Firebug not reading css on this site (not on my mac anyway).

try this, change the post to

<div id="table1">
<table><tr>
<td> <a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/traceyourancestors.jpg"><img class="pmw aligncenter size-full wp-image-76" title="traceyourancestors" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/traceyourancestors.jpg" alt="" width="250" height="172" /></a></th>
<td><a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/bestsellingplaysets.jpg"><img class="pmw aligncenter size-full wp-image-75" title="bestsellingplaysets" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/bestsellingplaysets.jpg" alt="" width="250" height="173" /></a></td>
<td><a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/smallgreenhouses.jpg"><img class="pmw aligncenter size-full wp-image-74" title="smallgreenhouses" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/smallgreenhouses.jpg" alt="" width="250" height="191" /></a></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/bestportablekeyboards1.jpg"><img class="pmw aligncenter size-full wp-image-72" title="bestportablekeyboards" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/bestportablekeyboards1.jpg" alt="" width="250" height="177" /></a></th>
<td><a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/sneakersonlinereviews.jpg"><img class="pmw aligncenter size-full wp-image-73" title="sneakersonlinereviews" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/sneakersonlinereviews.jpg" alt="" width="250" height="192" /></a></td>
<td><a href="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/traceaperson.jpg"><img class="pmw aligncenter size-full wp-image-70" title="traceaperson" src="http://www.webspotdesign.co.uk/wp-content/uploads/2011/02/traceaperson.jpg" alt="" width="250" height="185" /></a></td>
</tr>
</table>
</div>

add this to the CSS Inserts

#table1 { 
  margin-left: 03% ;
  margin-right: auto;
}

Brilliant! That's solved it. Thank you very much.
I've been comparing the code:

you've removed the entire table style code line?
changed the img class to pmw ?
removed <th scope "row"></th> (x2)
removed: <tbody></tbody>

I'd like to be able to understand why this has worked (if you've got the time) - it's certainly tidier coding.

Donation (small - but I hope it will buy you a couple of beers) on it's way.

Cheers!

you've removed the entire table style code line?

yup, the the table becomes as wide as center column and any styling is done via CSS

changed the img class to pmw ?

oops, remove it. That was just there so I could put a border around the images and visually look teh layout

removed <th scope "row"></th> (x2)

the <th> is a column header but you were using it as a table cell, no need for it so simplify

removed: <tbody></tbody>

again, you don't need them in a simple table so why have them, it just complicates things.

Originally Posted by juggledad

a <th>defines a header cell and you are using it as a data cell. Who knows what it might do eventually. You need to be careful using something like DreamWeaver to create something and then just dropping it in to a pose. You should see what happens if you just do a copy/paste from a styled Word document - disaster

also if you have

<div align="center">

that doesn't equate to a CSS 'text-align:center' you need to use 'margin-left:auto; margin-right:auto'.

one other thing, if I click on one of the design's I get a small image. you should set it up so I can see a large version of the image, after all, if I'm looking at one of your designs, I actually want to be able to see it.

Juggledad,

I have hit a wall and don't know where to turn next.

I don't have several months to learn how to do the next step, and it seems it should be easy. I am trying to create one "style" that can be used on a whole series of "fact sheet" pages (http://www.strategiclearning.com/wor...person-series/) to look like the first page of their PDF cousins (http://strategiclearning.com/FactShe...SP20110303.pdf) (without the Headers and Footers on the PDF) which are generated in MS Word. I have experienced the "Disaster" of trying paste MS Word via the ATO interface. I even tried saving the MSWord document as CSS/HTML and pasting that into ATO - more ugliness. I've deleted those attempts since they don't work. Here's a sample of the CSS output by MS Word - if you are interested:

/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:Tahoma;}
p.MsoHeader, li.MsoHeader, div.MsoHeader
{margin:0in;
margin-bottom:.0001pt;
border:none;
padding:0in;
font-size:9.0pt;
font-family:Tahoma;}
p.MsoFooter, li.MsoFooter, div.MsoFooter
{margin:0in;
margin-bottom:.0001pt;
border:none;
padding:0in;
font-size:8.0pt;
font-family:Tahoma;
color:#071F51;}
span.MsoPageNumber
{font-weight:bold;}
a:link, span.MsoHyperlink
{color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{colorurple;
text-decoration:underline;}
p.MsoAcetate, li.MsoAcetate, div.MsoAcetate
{margin:0in;
margin-bottom:.0001pt;
font-size:8.0pt;
font-family:Tahoma;}
p.FSBorder, li.FSBorder, div.FSBorder
{margin:0in;
margin-bottom:.0001pt;
text-align:center;
font-size:6.0pt;
font-family:Tahoma;}
p.FSNorm, li.FSNorm, div.FSNorm
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:Tahoma;}
p.FSBody, li.FSBody, div.FSBody
{margin-top:0in;
margin-right:0in;
margin-bottom:10.0pt;
margin-left:.2in;
font-size:11.0pt;
font-family:Tahoma;
color:black;}

It seems there should be a way to create a template that would accept output from MS Word and display the HTML with "Styles" that are nearly identical to those in the MS Word document. I have dozens of MS Word Documents that I'd like to make into pages and messing with the text from each one individually to make it look right would be a pain. I really only need seven or eight different paragraph styles, plus one table style. I know I am pretty sure I can get MSWord to put tags around paragraphs with different styling, so I think I could quickly output a plain text document with all the proper tags - if there was a way WordPress to then make them display properly.

So far, the web is not revealing its secrets to me, even after six hours of searching.

If there isn't a way of learning the basics of creating a style sheeet that could be used within ATO just for "Fact Sheet" pages in a couple of days, how do you suggest I proceed? I guess I could just use the page title as a link that goes to a PDF, but I'd prefer to have the text be searchable (I know I don't have a search Widget set up right now, but that's easy with ATO).

Besides, "Here's another idiot who probably also thinks its easy to perform brain surgery." what are your reactions, thoughts, recommendations about my achieving my objective?

Thanks