-1

このコードを使用して、使用する実際のブラウザを段落に追加し、さらに下に id=browser を追加します

$(function ()
{
    $("#browser").text('sBrowser');
});

問題は、私の段落id=browserが 1 行下に配置されていることです。

さらに下には、このマークアップがあります

<div id="info">
    Torsdag : <time>2013-09-05 16:00:00</time>
    <p id="browser"></p>
</div>

id=browserマークアップ段落をこの行のすぐ下に配置したい

Torsdag : <time>2013-09-05 16:00:00</time>

間に空の行がない

このマークアップを IE 9 で実行すると、上が空であることがわかるように、この結果が得られます。sBrowser

トースダグ: 2013-09-05 16:00:00

ブラウザ

代わりにこうなりたい

Torsdag : 2013-09-05 16:00:00
sBrowser

では、私が望む外観を得るには、何を変更する必要がありますか。

これが完全なマークアップと css です。

<!DOCTYPE html>
<html>
   <head>
      <meta charset = "utf-8">
      <title>Kontaktuppgifter</title>
      <script src="js/jquery.js"></script>
      <script src="js/flygbolag.js"></script>
      <script type="text/javascript">

         $(function ()  //wait until the DOM is complete
         {
            $("#browser").text('sBrowser');
         });

      </script>

      <style type = "text/css">
         body
         {
            font-size:small;
            width:72em;
            background : #87a5be url(img/bg.jpg) no-repeat right bottom fixed;
            background-repeat:no-repeat;
            margin:0;
            padding:0;
            margin:0.2em auto;
          }

          header #info
          {
             font-size:120%;
             float:right; 
             font-weight:bold;
          }
      </style>   
  </head>

  <body id="kontakt">
     <header>
        <div>
           <div id="info">
              Torsdag : <time>2013-09-05 16:00:00</time> <br />
              <p id="browser"></p>
           </div>
        </div>
     </header>
 </body>
</html>
4

3 に答える 3

1

CSSに追加してみましたか:

p#browser{
    margin:0;
    padding:0; /* only if needed... */
}

ところで、<br>使用する -は必要ありません<p>すでにブロックレベルの要素であるためです ( inlineまたはinline-blockとして厳密に定義されていない場合)


(代わりに)必要になるかもしれないのは、たとえば
http://meyerweb.com/eric/tools/css/reset/のような素敵な小さな CSS リセットです。

于 2013-09-10T00:28:21.817 に答える
0

本当の問題は、pデフォルトの上(および下)マージンがあることを考慮せずに要素を使用していることにあるようです。最善の解決策は、そのような既定のレンダリングを持たない要素、つまり を使用することですdivbrthen はdiv、新しい行から始まるブロックとしてレンダリングされるため、必要ありません (使用すべきではありません) 。

       <div id="info">
          Torsdag : <time>2013-09-05 16:00:00</time>
          <div id="browser"></div>
       </div>
于 2013-09-10T05:24:15.793 に答える
0
<div>
    <div id="info">Torsdag :
        <time>2013-09-05 16:00:00</time>
        <br /> <span id="browser"></span>
    </div>
</div>

ここのように:http://jsfiddle.net/psQJg/


交互に編集: CSS as

#info,#browser {float:left;}

次のようにマークアップします。

<div>
    <div id="info">Torsdag :
        <time>2013-09-05 16:00:00</time>
        <span id="browser"></span>
    </div>
</div>

http://jsfiddle.net/psQJg/1/

于 2013-09-10T00:28:18.290 に答える