Question

enter image description here

我的CSS文件就像这样

@charset "utf-8";
/* CSS Document */


#test
{   background:#0CF;
    text-align:right;
    margin-top:0px;
    margin-left:735px;
    width:200px;
    margin-top:inherit;

    }

    #text
{
    background:#C6C;
    text-align:left;
    margin-right:203px;
    margin-top:-18px;
    }

        .main
{   background:#396
    text-align:left;
    margin-top:150px;
    margin-left:20px;
    margin-right:40px;
    position:fixed;
     border: 1px solid;
    }

.container
{

    background:#CCC;
    padding-top: 2px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    margin-right:20px;
    width:299px;
    height:270px;
    border: 1px solid;
    margin-top:-74px;

    bottom:100px;
    right:5px;

    }

这是HTML文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>

<link rel="stylesheet" href="prat.css">

</head>

<body>
<div class="main">
<div id="text">
  <p>Thankyou for taking the time to visit our website.

This site exists primarily for existing clients to access updates on current investments they have with us and for Marketwise Investments to provide new opportunities as they arise.

If you are a prospective client, please read on to learn more about MarketWise Investments and the work we do.

MarketWise Investments is a Sydney-based development and property investment company with a diverse range of projects across Australia and overseas.
</p>
</div>
<div id="test">
<p>We offer professional, efficient investment.and development strategies for clients in both domestic and international markets, looking for cash-positive property investments where possible.</p>
</div>
<span class="container">
<p>We offer professional, efficient investment and development strategies for clients in both domestic and international markets, looking for cash-positive property investments where possible.

All projects are carefully considered and aligned with market demand to maximize the best possible returns for our clients.</p>
</span>
</div>


cross browser 
grade
box model

</body>
</html>

在图片中，您可以看到一个div标签不在另一个旁边。我想把它放在首位。我试过保证金 - 。但没有成功。有人可以帮助我

Answer 1

在float:left的

上使用div

Answer 2

由于你标记了这个css3，我会给你css3答案。

<body>
  <div id="box1">1</div>
  <div id="box2">2</div>
  <div id="box3">3</div>
</body>

（使用供应商前缀）

body{
  display: box;
  box-orient: horizontal;
}

请参阅http://hacks.mozilla.org/2010/04/the-css-3-flexible-box-model/

另外http://jsfiddle.net/4eqve/

Answer 3

CSS：

#box1 {
    float: left;
    width: 80%;
    height: 100px;
    background:#0CF; 
    }

#box2 {
    float: right;
    width: 20%;
    height: 100px;
    background:#C6C;
    }

<强> HTML：

<section id="box_wrap">
  <div id="box1">1</div>
  <div id="box2">2</div>
</section>

结果： http://jsfiddle.net/j3ffz/pDjEj/

如何在另一个div标签旁边创建一个div标签

3 个答案: