WordPress.com Forums » Topic: Adding tables to twentyeleven

justpi on "Adding tables to twentyeleven"

justpi — Fri, 08 Jun 2012 03:02:23 +0000

A heading is the title of a chapter or a section. By definition, a heading presupposes other, subordinate text below it. So your links aren't "actual" headings: they may be "intended" headings but the intention is wrong.

Timethief's reply is irrelevant: the clear:both command does the opposite of what you want.

As I already said, what you need to do is delete the h tags altogether and use style inside the a tags.

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 22:14:47 +0000

they are intended actual headings, as links to pages.
I just wanted images littered around, and they are set to alignright etc
I've tried moving images outside h, using <br style="clear:both;" />, but all the same still.

justpi on "Adding tables to twentyeleven"

justpi — Thu, 07 Jun 2012 14:47:54 +0000

It's not the images, it's the h tags. By default, a heading is formatted as a separate block, so when you have (erroneously) enclosed link plus image in h3 tags, the rest of the content will start below the image.

The h tags have a specific meaning for search engines and screen readers, so you should only use them for actual headings of articles, not just to change the styling of any text. To change the styling of your links, you add style to the a tags. See here:
http://wpbtips.wordpress.com/2009/07/11/formatting-text-pt-5/

timethief on "Adding tables to twentyeleven"

timethief — Thu, 07 Jun 2012 14:43:19 +0000

The alignment icons in the WordPress editor are for aligning text; they are not for aligning images. http://en.support.wordpress.com/visual-editor/#alignment They are used to achieve wrapping text around images on either the right or left hand side, or to display an image that's centered without text on either side of it. If the text beside the images does not occupy the same amount of space that the image beside it does then the text wrapping will continue and the images and text that follow will have a staggered appearance.

Align-left means position left, with the rest of the content wrapping around the right side of the image.
Align-right means position right, with the rest of the content wrapping around the left side of the image.
Align-center means position center, with no wrap-around (= the rest of the content below the image).

If you want two images to be side by side on the same line start by setting the alignment of both images to left. see > http://en.support.wordpress.com/images/image-alignment/ To prevent the staggered effect what you do is insert the following snippet of code into the HTML editor after each image/text pair:

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 14:23:39 +0000

OK I'll look at that.

Something separate, in this page
http://valenttwentyeleven.wordpress.com/japan-2009/
Can you tell me why the images now break the text up? It didn't used to so I'd get the links in a row and pics every now and then.

justpi on "Adding tables to twentyeleven"

justpi — Thu, 07 Jun 2012 14:00:54 +0000

a) Even so, a table is an unnecessary complication. Use coding for two columns instead. See here:
http://wpbtips.wordpress.com/2009/06/10/formatting-text-pt-1/

b) Yes, and that's yet another reason to switch to a different theme - a fixed-width one.

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 12:46:39 +0000

I need the table to have the caption. The gallery captions don't get the frames.

Did you see how the front page goes weird when the browser gets very narrow?

justpi on "Adding tables to twentyeleven"

justpi — Thu, 07 Jun 2012 11:40:37 +0000

Yes, forgot that, horizontal adjustments should be expressed in percentages if the width is flexible.

But I thought you only wanted to change the content width of the intro page. If you want do that for all pages, you're simply using the wrong theme: select a different theme - one that doesn't have the (rare) flaw of retaining the same width for pages with and without sidebar.

As for your "Events" page, you don't need a table to arrange multiple images: use the gallery feature.

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 11:14:20 +0000

I've changed your code to use % instead of px, and got it looking OK and centered.
But once it shrinks to a point it 'blows up'

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 10:46:58 +0000

I've found a different issue. The theme is 'responsive width'. Normally images etc will scale.

But tables will not scale?
I added that div to this page

http://valenttwentyeleven.wordpress.com/photoshoot/events/

since the -207px; is fixed it will stuff up once the page starts to shrink.
Also the images in captions also won't shrink with the page.

justpi on "Adding tables to twentyeleven"

justpi — Thu, 07 Jun 2012 10:25:01 +0000

The left property doesn't work by itself: it's associated with the position property.
Other remarks:
The !important command is for the CSS editor.
border="0", cellspacing="1", cellpadding="1" are outdated and don't work.
Setting a 100% width is superfluous, because that's the default in 2011.

The easiest way to create full-width content is to enclose it in a div with negative margins:


TABLE OR OTHER CONTENT HERE

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 10:03:20 +0000

I've tried sticking style tags around but can't seem to get it to move left

The left tag doesn't work. Of course this is a crappy way of doing it too...

valentlau on "Adding tables to twentyeleven"

valentlau — Thu, 07 Jun 2012 09:33:58 +0000

This is a test site.

Can the front page content be made to extend the full width?
I'd like it to be a table, width 70% 30% and a border around the table