CSSを使用した見出し領域内に、リンクを配置したい

Question

前提・実現したいこと

作成中のwebページに<DIV>タグを使用して見出し領域を設けています。
左寄せでページのタイトルを表記していますが、この領域内の右端に
別ページへのリンクを置きたいのです。
(イメージ)
――――――――――――――――――――――――――
タイトル　　　　　　　　　　　　　　　　　　リンク
――――――――――――――――――――――――――
(現状)
――――――――――――――――――――――――――
タイトル
'　　　　　　　　　　　　　　　　　　　　　 リンク
――――――――――――――――――――――――――
普通に<a>タグ記載では左寄せ状態になってしまうため、<div>を入れ子にして<a>タグを囲い、
align="RIGHT"属性を記述したら右端に配置されましたが、改行されていてしまいます。
改行せずに右寄せにするには、どのように記述すればよいのかをご教示お願いします。

該当のソースコード

div.title{
    padding: 12px;
	font-size:36px;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.75);
    background: linear-gradient(#325A8C 0%, #1C3959 100%);
	border:1px solid #325A8C;
    box-shadow:inset 1px 1px 0 rgba(255,255,255,0.25);
    font:"メイリオ",sans-serif;
}

<div class="title">webページタイトル<div align="right"><a href="URL">リンク</a></div></div>

Answer 1

<div class="title">
  webページタイトル
  <div style="float: right;"><a href="URL">リンク</a></div>
</div>

Comments

[ysk1118]

回答ありがとうございました。
イメージ通りの表示にすることができました！
-shu-さんのご回答と比較すると、入れ子の親divに"float:left”の有る無しで挙動が変わるのですね。
この辺について一度よく調べてみようと思います。

Answer 2

[div]はブロックレベル要素のため、そのCSSだけでは対応できません。

下記のように変更してみてください。

<div class="title" style="float:left;">webページタイトル<div align="right" style="float:right;"><a href="URL">リンク</a></div></div>

調整等も含めて「html 横並び」と調べてみると色々とわかるかと思います。

Comments

[ysk1118]

回答ありがとうございます。
ご指摘のように変更したところ、タイトルとリンクが1行に納まりましたが、間の空白が詰められて
-----------------------
|タイトルリンク |
-----------------------
という表示になりました。また、titleクラスのdiv領域自体、ウィンドウの幅MAXにしていたのが、
ウィンドウの左半分に納まってしまいました。
まずは、ご指摘いただいたキーワードについて調べてみたいと思います。