Div Divignment内部和自动宽度 [英] Div inside Div Alignment and auto width

问题描述

HI朋友，

我正在开发Android应用程序，在我的应用程序中我想为

 1创建3个按钮。添加任务< br /> 
 2.删除任务< br /> 
 3.保存任务

I我正在使用Div而不是按钮

< div id =actionsclass =divActions topMargin> 
< div id =divAddclass =button floatLeft> 
添加任务
< / div> 
< div id =divDeleteclass =button floatLeft> 
删除任务
< / div> 
< div id =divSaveclass =button floatLeft> 
保存任务
< / div> 
< / div> 

我有以下风格

。 divActions  { height  ：  5em; } 
＃ divAdd ，＃ divDelete ，＃ divSave ，＃上一页，＃ taskno ，＃ next  { width  ：  32％; } 
。按钮 
 {
  border  ：  1px solid＃C7C7C7;  
  height  ：  3em;  
  background  ：  #FCFCFC;  
  vertical-align  ：  middle;  
  text-align  ：  center;  
  width  ：  10％;  
  cursor  ： < span class =code-keyword>指针;  
 颜色 ： < span class =code-keyword>＃2489CE;  
} 

我的问题是如果工作在一些手机中很好，但随着分辨率的变化，3 div不是直线，其中一个div进入下一行。


任何人都可以知道我的3 div的宽度如何自动占据屏幕宽度的1/3？



提前致谢

解决方案

为容器div设置一个特定的可调节div宽度百分比，即：divActions



.divActions {高度：5em的;宽度：80％;}

HI friends,
I'm developing android application, in my application I want to create 3 buttons for

1. Add task<br />
2. Delete Task<br />
3. Save Task

I'm making use of Div instead of buttons as following

<div id="actions" class="divActions topMargin">
            <div id="divAdd" class="button floatLeft">
                Add Task
            </div>
            <div id="divDelete" class="button floatLeft">
                Delete Task
            </div>
            <div id="divSave" class="button floatLeft">
                Save Tasks
            </div>
    </div>

I have Given following style

.divActions{height:5em;}
#divAdd, #divDelete, #divSave, #prev, #taskno, #next{width:32%;}
.button
{
    border: 1px solid #C7C7C7;
    height: 3em;
    background: #FCFCFC;
    vertical-align: middle;
    text-align: center;
    width: 10%;
    cursor: pointer;
    color: #2489CE;
}

My problem is it if working fine in some mobiles, but as resolution changes the 3 div are not in straight line one of the div goes in next line.

Can anyone give idea how the width of my 3 div can automatically takes the 1/3 of the screen width?

Thanks in advance

解决方案

Set a particular adjustable div width in percentage for your container div i.e:divActions

.divActions{height:5em;width:80%;}

这篇关于Div Divignment内部和自动宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！