TED talk embed test

Moar img {max-width: 100%;}

See also.

Thanks again, Ethan Marcotte and Richard Rutter.

The images below are all of one that is 1060px x 600px, at full scale.

Here is Blogger's default centered, large layout:

(Used Blogger to host the image because Photobucket resizes anything wider than 1024 px.)

Here it is with style="max-width:100%; border:none; margin:0;"

Here it is with style="max-width:100%; border:none; margin:0; padding:0;", since Blogger (in this template, at least), specifies padding:4px for all images in posts.

img {max-width: 100%;}

Thanks, Ethan Marcotte and Richard Rutter.

The first two images below have style="max-width:100%; border:none; margin:none; padding:none;"

The following image has the same styling as above, except max-width is set to 50%.

Links to some specialized feeds from my real blog

Just posts tagged "science:"

http://bjkeefe.blogspot.com/feeds/posts/default/-/science

Just posts tagged "cool:"

http://bjkeefe.blogspot.com/feeds/posts/default/-/cool

Just posts tagged both "cool" and "science:"

http://bjkeefe.blogspot.com/feeds/posts/default/-/cool/science

Reference links and more details here.

Styling PRE, as oxymoronic as that sounds

Here is a long URL within the flow of regular text: http://www.google.com/cse?cx=007432832765683203066%3Azj_ist-lct4&ie=UTF-8&q=bjkeefe&sa=Search&siteurl=www.google.com%2Fcse%2Fhome%3Fcx%3D007432832765683203066%253Azj_ist-lct4&ref=&ss=847j149539j7#gsc.tab=0&gsc.q=bjkeefe&gsc.page=1

Here is the same URL, enclosed in <pre></pre>, on a line following the regular text:

http://www.google.com/cse?cx=007432832765683203066%3Azj_ist-lct4&ie=UTF-8&q=bjkeefe&sa=Search&siteurl=www.google.com%2Fcse%2Fhome%3Fcx%3D007432832765683203066%253Azj_ist-lct4&ref=&ss=847j149539j7#gsc.tab=0&gsc.q=bjkeefe&gsc.page=1

On this blog, the text that won't fit within the width constraint of the post area is chopped. (At least visually -- it's possible to select the whole thing, including the part that's not displayed, by triple-clicking the line.) On other blogs, the text may run over the sidebar, or the browser itself may add a horizontal bar, giving the incorrect cue that the whole page is really wide. All of these can be annoying.

Same as above, except <pre> has inline CSS styling that causes the horizontal scroll bar to appear (if necessary) only under the one particular ling:

http://www.google.com/cse?cx=007432832765683203066%3Azj_ist-lct4&ie=UTF-8&q=bjkeefe&sa=Search&siteurl=www.google.com%2Fcse%2Fhome%3Fcx%3D007432832765683203066%253Azj_ist-lct4&ref=&ss=847j149539j7#gsc.tab=0&gsc.q=bjkeefe&gsc.page=1

!!!

Notes ...

In re "if necessary," here is a short <pre> bit of text, same styling:

http://www.google.com/

That is, no horizontal scroll bar, because it wasn't needed, but same bit of CSS can be used. This would be handy if you had lots of lines of text that you didn't want to wrap, some of which would be too long, some not.

The styling:

<pre style="overflow:auto;">[...]</pre>

First seen in the CSS file associated with an Ars article:

.article-content pre {
 overflow: auto;
}

More here.

I first thought it was a form when reading the Ars article. When single-clicking the text above the scrollbar didn't select the whole line, as I expected (such as in the box containing the URL that appears when you click the Share button under a YouTube video), I triple-clicked it. When that somewhat surprisingly did what I wanted (selected the whole line of text), it made it seem worth doing a CTRL-u.

It may still be worth putting a longish chunk of text into a form if the intent is to make it easier for readers to copy it.

Also may be worth giving some thought to how overflow:auto; might be used with oversized images.

Cnet embed test

Hark embed test

CSS properties letter-spacing and word-spacing

The letters in this paragraph have style="letter-spacing:3px;"

The words in this paragraph have style="word-spacing:6px;"

The words in this paragraph have style="word-spacing:6em;"

The letters and words in this paragraph have no added styling.

See "All CSS Text Properties" here. More here, here, and here.

Caption test

Caption: Not a Red LeafThis is text that wraps around the leaf image that features a caption. You might want a caption under the picture of the leaf if you were writing about leaves in your post. The caption sits below the text and helps the user to understand what the picture is about. This is text that wraps around the leaf image that features a caption. You might want a caption under the picture of the leaf if you were writing about leaves in your post. The caption sits below the text and helps the user to understand what the picture is about. This is text that wraps around the leaf image that features a caption. You might want a caption under the picture of the leaf if you were writing about leaves in your post. The caption sits below the text and helps the user to understand what the picture is about.

See also.

background test 2

Below should be a black background for a transparent animated gif.

background test

I just was outside, enjoying a cigarette.

At a quarter to two in the am.

On the 30th of November.

In NY, USA. In bare feet and shorts.

Enjoying, I say. Enjoying.

So, Sen. Inhofe ... WHERE IS MY TESTIMONIAL IGLOO?

(?)

DS embed test

... a couple of days ago, but thank JoePA the FSM I didn't. Because Massimo Pigliucci has pointed out someone who said it far better than I could have.

(alt. video link)

Embed test of Newsy video

Source: newsy.com/videos/google-takes-street-view-inside/

Original dimensions of 640 x 360 were re-specified by me as 480 x 270 in the HTML code for this post.

Slideshow embed test 450x350

Wikio ranking (for my real blog)

(11783 at original posting.)

Testing Blogger's Fancy New After The Jump Feature

This should be above the fold.

Read more »

Embed Test

Special Characters

Trademark symbol:   ™   ™

Send Me Email

Embed Test: Flash (SWF) object hosted by ImageShack

What Bad Santa would ask:

Direct link: http://img222.imageshack.us/img222/637/offyourmedsvc8.swf

See also: http://bjkeefe.googlepages.com/question.html

Embed Test: Le Show

From 29 June 2008 edition. Code obtained by clicking "Listen;" i.e., from window that launches to deliver streaming mode.

test of bh.tv embed

Dummy Post To Get Image Uploaded to Blogger

Ping

This was posted at about 5:37 AM on Fri 18 Jan 2008, to see if signing in with BlogAlert will work. I used the signup form on that page, and if it does work, there is a widget available that can be added to my blog.

The claim is: updates are delivered daily. I did the sign-up and clicked on the confirmation link at about 5:32. Good luck!

P.S. Used the front email address for this first test. Should use another to test if add widget. Should also investigate how easy it is to unsubscribe.

P.P.S. Entered the URL corresponding to the feed icon in the location bar when I signed up: http://bjkeefe-test.blogspot.com/feeds/posts/default

If that doesn't work, go back and try: http://bjkeefe-test.blogspot.com/atom.xml

Indenting text without BLOCKQUOTE or stupid list tricks

This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text.

This text should be indented. This text should be indented. This text should be indented. This text should be indented. This text should be indented. This text should be indented.

This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text. This is the normal layout for a paragraph of blog text.

Here, the styling is done inline, using a DIV tag and a different amount of indenting. NB: DIV tags go outside the P tags.

Back to normal. Back to normal. Back to normal. Back to normal. Back to normal. Back to normal. Back to normal. Back to normal. Back to normal. Back to normal.

This new technique might be used to indent the attribution line in our blockquote style, as seen here. Will have to get used to adding a BR at the end of the quoted text.
-- dummy link

Here's an example of the new blockquote styling (should be little apparent difference, but the code is cleaner).
-- dummy

Thanks to HTML Code Tutorial.

A note on positioning

Suppose you want to float some text around two images, and you'd like the second section of text to start alongside the second image. I'm not sure if this is entirely right (although it does validate), but putting this line in between the two sections seems to do the job:

<div style="clear:both;"></div>

The text in italic should be aligned as desired, no matter the font or window size changes.

Note that I added a couple line breaks to move the text-image sections farther apart, but omitting them doesn't change anything.

This text should be below everything, courtesy of another <div>.

Update: changed code slightly: images now within the <p> block, and <br>s used for separate paragraphs in specific section.

Test for Email Notification

Signed up people should see this post via email.

Update: Doesn't seem to be working. Back to the feed chain!

Using <span>, and other ways, to modify text in line

Normal line, defaults to template specifications.

This text will be red.

Part of the text in this paragraph will be highlighted, but not all.

Another normal line, defaults to template specifications.

The following blockquote adds a style tag to the <blockquote> tag itself, to make the box of color rectangular. (Using span just changes the background color for individual character cells.)

Some lines of text, presumably all sharing the same background color. Some lines of text, presumably all sharing the same background color. Some lines of text, presumably all sharing the same background color.

The following blockquote adds a style tag to right-align the text.

Some lines of text, presumably right-aligned. Some lines of text, presumably right-aligned. Some lines of text, presumably right-aligned. Some lines of text, presumably right-aligned. Some lines of text, presumably right-aligned. Some lines of text, presumably right-aligned.

Same thing, only this time we style the <p> tag:

Some more lines of text, presumably right-aligned. Some more lines of text, presumably right-aligned. Some more lines of text, presumably right-aligned.

test of link to post

This is a link to another post on this blog, to see how the "links to this post" footer element works.

Copy of a long post

The following is a copy of a post from my main blog, reposted here I could look at a post with lots of text.

The following is a copy of an email that I sent to Alexei Barrionuevo of the NY Times.

Dear Mr. Barrionuevo:

Your story in today's Times, "In a Place of Solace, Finding Faith Among the Sorrow," reminds me why I am so glad that people like Harris and Dawkins and Hitchens and Dennet have been speaking up.

Okay, so it's sad that people got killed in an earthquake. And it's understandable -- one might even say "only human" -- that people who have spent their entire lives clinging to a belief system would try to force current events to conform to that belief system. I'm mystified by this behavior, but I recognize that it happens.

The thing that really irks me is the article's tone. There is no sense of the skepticism that one would expect when a reporter is covering a story where irrational claims are being made. There is no response to quotes like this:

"The only thing we can do now is pray and give thanks to God."

For dropping a church on the heads of those inside, and killing sixty of your friends?

In any other story, you would have gone all over town, looking for a statement from someone with a different point of view. Failing that, the trusty Rolodex would have been consulted. As a thought experiment, suppose I had mobilized my whole town to claim, "This church collapse shows there is no God." Do you think there's any chance at all, if you were covering my group, that you wouldn't flesh out the the story with differing viewpoints? Do you think your editor would let you get away with this, if you didn't?

Instead, we get treacly nonsense like this:

But the town's residents have drawn faith from what they see as small miracles.

So, a stone statue that was outside the church is plucked more or less intact from the rubble (unlike the scores of people inside, mind), and this is a miracle?

In any other realm of human thought, this would be labeled as insanity, or more politely, at least "temporarily disoriented thinking."

A common criticism leveled at the so-called New Atheists is that we try to paint all people who hold religious beliefs as completely mindless. This is untrue. I don't think that, and a careful reading of the above authors will show that, too. What we are asking is this: Isn't it about time to subject religiously motivated behavior to the same scrutiny as we do every other aspect of human affairs?

Brendan Keefe
Rochester, NY, USA