Question

I am quite new to css and html, and I am having trouble floating divs within a another div, I ve done quite a bit of research online but have not been able to come up with a solution.

www.un.org/Depts/DGACM/index_russian.htm

光靠fitz /cast/html-training/cs/positioning/

st/问题/580195/cs-layout-2-column-fixed-fluid

mirificampress /show.php?id=106

• 如何在固定宽度DIV内进行电离辐射处理?

我的守则见于jsFiddle 。

Answer 1

I hope this will help. CSS:

#left, #right {
 width: 100px; //change this to whatever required
 float: left;
}

传真:

<div id="wrapper">
    <div id="left">
       <p class="t0">lorum itsum left</p>
    <div>
    <div id="right">
       <p class="t0">lorum itsum right</p>
    <div>
<div>

Answer 2

Since you are a beginner. I will make it straight forward. Below is extraction of your code. I used internal style sheet. Your example you are using external style sheet. Using float attribute you can set it to left and right. Here is used float:left to alight one div to left and float:right to alight other one to the right. Each opened tag has to be closed tag.

    <head>
    </head> 
    <!--Internal style sheet-->
    <style>
    .left{
    float:left;
    }
    .right{
    float:right;
    }
    </style>

    <body>
    <div id="wrapper" >
        <div class="left">
            <p class="t0">lorum itsum left</p>
        </div>
        <div class="right">
            <p class="t0">lorum itsum right</p>
        </div>
    </div>
    </body>
    </html>

附加说明: 如果你想调整左侧面积和右 d,那么就在风格上使用宽松。参看下文更新的风格表。我离开了四肢宽到80%的屏幕宽度和右宽到20%(总数应为100%)。相应调整。用于确定四分五裂的背景图。

.left{
float:left;
background-color:powderblue;
width:80%;
}
.right{
float:right;
width:20%;
background-color:yellow;
}

Answer 3

与此类似:

http://jsfiddle.net/Ev474/。

<div id="wrapper">
    <div id="inner">
        <div id="left">
            Left Content
        </div>
        <div id="right">
            Right Content
        </div>
    </div>
</div>

div {
    height: 50px;
}
#wrapper {
    width: 200px;
    overflow-x: auto;
    overflow-y: hidden;
    background-color: #ccc;
}
#inner {
    width: 400px;
}
#left {
    width: 150px;
    float: left;
    background-color: #f00;
}
#right {
    width: 150px;
    float: left;
    background-color: #0f0;
}

友情链接