How to left/center/right-aligned affiliate links such as Adsense · Amazon

This post is also available in: 日本語 (Japanese)

The contents have any questions well when I have the help of web marketing small business.

How to left/center/right-aligned affiliate links such as Adsense · Amazon

Example code to insert directly the CSS (StyleSheet) to HTML

When the problem occurred in the design by using Copy and Paste the following code, or when is not left-aligned · center-aligned · right-aligned, CSS other are interfering with something.

Another solution is required at that time.(In most cases, it is a matter of an "inline element" and "block element". This article, I am writing to assume "inline elements".)

left-aligned

<div style="text-align:left;">
	<!-- put the affiliate link on this part -->
</div>

center-aligned

<div style="text-align:center;">
	<!-- put the affiliate link on this part -->
</div>

right-aligned

<div style="text-align:right;">
	<!-- put the affiliate link on this part -->
</div>

Example to use (StyleSheet) External CSS

If you think "insert directly the CSS (StyleSheet) to HTML" is not beautiful, there is also a way to left-aligned · center-aligned · right-aligned by an external style sheet.

left-aligned

HTML Code

<div class="LinkLeft" >
	<!-- put the affiliate link on this part -->
</div>

External CSS Code

.LinkLeft{
text-align:left;
}

center-aligned

HTML Code

<div class="LinkCenter">
	<!-- put the affiliate link on this part -->
</div>

External CSS Code

.LinkCenter{
text-align:center;
}

right-aligned

HTML Code

<div class="LinkRight">
	<!-- put the affiliate link on this part -->
</div>

External CSS Code

.LinkRight{
text-align:right;
}

When you want to float the image to text?

When you want to float the image to text, use CSS "float" and "margin".


However, the use "float" adn "margin" is difficult. You should consider to the above method is good.

No tags for this post.