divを並べて配置するのと同じくらい簡単なことを達成しようとしています。問題は、私が CSS で非常に有能であることですが、使用しようとしているソリューションが意図したとおりに機能しないことです。ここに問題があります。
私は使用しました:(したがって、両方のdivが並んでいます)
表示ブロック;
フロート: 左;
マージン右: 15px;
そして、それは問題なくLOCALLYで動作します。これは、html と css がシステムに組み込まれ、その後 javascript タグに生成されるテンプレート ソリューションとして作成していることです。JavaScript タグはさまざまな Web サイトにスローされるため、すべてのブラウザーで同様に機能することが非常に重要です。
次に、div(横にあるもの)を次のように配置しようとしました:絶対的で、左を使用して横に配置します...タグが実装されている場所に絶対的であるため、それも機能しません。つまり、表示されますタグが実装されているサイトによって場所が異なります。
だから私の質問は、cssまたはjavascriptのいずれかを使用して、タグを実装する場所に関係なくdivを並べて表示する方法はありますか?
以下は私のコードです:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Sidekick</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="scripts/sidekick.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="eas_sidekick_divs">
<div id="eas_sidekick">
<div class="eas_sidekick_open">x</div>
</div>
<div id="eas_sidekick_container"></div>
</div>
</body>
</html>
CSS:
.eas_sidekick_divs div
{
display: block;
float: left;
margin-right:15px;
}
#eas_sidekick
{
width:300px;
height:600px;
background: #ccc;
}
#eas_sidekick_container
{
width: 850px;
height:600px;
background: #ccc;
}
このソリューションは、前述のようにローカルで機能しますが、これをタグに生成した後では機能しません。ここで例を見ることができます: http://yoursource.eu/stuff/Templates/sidekick/300x250/javascript.html
IE や Chrome などのさまざまなブラウザーを見て、その違いとその動作の奇妙さを確認してください。
右側の小さなバナーのボタンをクリックすると、「exiting me」と表示され、div が展開されます。展開された div は、常に右に配置したいものです。
あなたが私を助けてくれることを願っています! :)