|
|
 slmingol posted this in example post on February 24th, 2011, @ 4:31 pmBackground
Have you ever had the need to put 2 thumbnails side by side and centered in a blog post in WordPress? Here’s how.
Solution
The approach below is to use div tags within another div tag that controls how the “child” divs are aligned.
1
2
3
4
5
6
7
8
9
| <div style = "text-align:center">
<div style="display: inline-block; margin-right: 50px">
.... IMAGE ....
</div>
<div style="display: inline-block">
.... IMAGE ....
</div>
</div> |
Example #1
NOTE: centered within the browser window
1
2
3
4
5
6
7
8
9
| <div style = "text-align:center">
<div style="display: inline-block; margin-right: 50px">
[caption id="" align="alignnone" width="58" caption="Left Image"]<img alt="Left Image" src="http://www.lamolabs.org/blog/wp-content/themes/atahualpa/images/logo.gif" title="Left Image" width="58" height="45" />[/caption]
</div>
<div style="display: inline-block">
[caption id="" align="alignnone" width="58" caption="Right Image"]<img alt="Right Image" src="http://www.lamolabs.org/blog/wp-content/themes/atahualpa/images/logo.gif" title="Right Image" width="58" height="45" />[/caption]
</div>
</div> |
 Left Image
Right Image
Example #2
NOTE: aligned to code box
1
2
3
4
5
6
7
8
9
| <div style = "margin-left: 10%">
<div style="display: inline-block; margin-right: 50px">
[caption id="" align="alignnone" width="58" caption="Left Image"]<img alt="Left Image" src="http://www.lamolabs.org/blog/wp-content/themes/atahualpa/images/logo.gif" title="Left Image" width="58" height="45" />[/caption]
</div>
<div style="display: inline-block">
[caption id="" align="alignnone" width="58" caption="Right Image"]<img alt="Right Image" src="http://www.lamolabs.org/blog/wp-content/themes/atahualpa/images/logo.gif" title="Right Image" width="58" height="45" />[/caption]
</div>
</div> |
Left Image
Right Image
NOTE: For further details regarding my one-liner blog posts, check out my one-liner style guide primer.
slmingol posted this in example post on February 17th, 2009, @ 12:00 pm
Example 1: Plain text
This is some test that I’m using as a test.
Still more text.
Example 2: Ordered list
- one
- two
- three
Example 3: Unordered list
Example 4: Formatting text
| Strikethrough: | -Hello World- becomes Hello World | | Superscripts: | Hello ^World^ becomes Hello World | | Subscripts: | Hello ~World~ becomes Hello World | | Code or quotes: | @Hello World@ becomes Hello World |
…. Continue reading → Formatting text using Textile »»
slmingol posted this in example post on February 16th, 2009, @ 2:51 am
Rails code blocks
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| class MakerNumbersController < ApplicationController
active_scaffold do |config|
config.columns = [:part_number, :description, :makers, :components, :created_at, :updated_at]
config.columns[:part_number].label = "Maker Part #"
config.columns[:makers].clear_link
config.columns[:components].clear_link
config.create.columns = [:part_number, :description, :makers]
config.update.columns = [:part_number, :description, :makers]
config.list.columns = [:part_number, :makers, :description]
config.show.columns = [:part_number, :description, :makers, :components]
end
end |
1
2
3
| Timecop.travel(Chronic.parse('this tuesday 5:00')) do
# test-fu
end |
slmingol posted this in example post on February 10th, 2009, @ 1:48 am
Example 1: PHP, no line numbers
Example 2: Java, with line numbers, collapse codebox
1
2
3
4
5
| public class Hello {
public static void main(String[] args) {
System.out.println("Hello World!");
}
} |
Example 3: Ruby, with line numbers starting at 18, code downloading(ruby.txt)
1
2
3
4
5
| class Example
def example(arg1)
return "Hello: " + arg1.to_s
end
end |
Example 4: Bash
40
41
42
43
44
45
46
| #!/bin/bash
echo "hi"
ls;
for i in 1 2 3 4; do
echo $i;
done |
…. Continue reading → [test]: WP-CodeBox #1 »»
slmingol posted this in example post on February 8th, 2009, @ 12:15 am
Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!
|
February 24th, 2011, @ 4:31 pm |
Tags: 
Category: 
