文字对齐:对;无论我尝试什么

时间:2016-11-22 07:32:49

标签: javascript css

我有这个简单的代码,显示星期几,时间和日期。文本应该在css中指定的右边对齐,但是我不知道为什么它不会固定在屏幕的右侧(不包括边距)它始终保持在屏幕的右侧之间的大空间窗口和它自己。

https://jsfiddle.net/czh9cam6/

 <div class="droite" id="time" >
 </div>

#time{
    text-align: right;
    display:table-cell;
}

.droite{
    width: 73%;
    display:table-cell;
    vertical-align:middle;
}

4 个答案:

答案 0 :(得分:1)

您无需在代码中添加display:table-cell属性。 只需删除该属性...然后根据您的要求保证金。 检查你的答案:

(function () {
    function checkTime(i) {
        return (i < 10) ? "0" + i : i;
    }

    function startTime() {
      var months = [ 'Janvier', 'Fevrier', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Aout', 'Septembre', 'Octobre', 'Novembre', 'Décembre' ],
          days = [ 'Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi' ]
    
        var today = new Date(),
            d = today.getDay(),
            f = today.getDate(),
            m = today.getMonth(),
            y = today.getFullYear(),
            
            h = checkTime(today.getHours()),
            i = checkTime(today.getMinutes());
        
        var val = days[d]+'<br>'+h+':'+i+"</span><br>"+f+' '+months[m]+' '+y;
        
        document.getElementById('time').innerHTML = val;
        
        t = setTimeout(function () {
            startTime()
        }, 500);
    }
    
    startTime();
})();
#time{
	text-align: right;
	//display:table-cell;
  
}

#aszone{
	margin-left: 20px;
	margin-right: 20px;
	height: 10%;
	display:table;
	background-size: cover;
}

.gauche{
	width: 27%;
	text-align: left;
	display:table-cell;
}

.droite{
	width: 73%;
	//display:table-cell;
	vertical-align:middle;
    margin-left:20px;
}

.helper{
	display: inline-block;
    height: 100%;
    vertical-align: middle;
}

img{

	vertical-align: middle;
	width: 150px;
}
<div id="aszone">
            <div class="gauche">
              <span class="helper"></span>
              <img src="http://www.tablesandfables.com/wp/wp-content/uploads/2016/06/youtube-logo.jpg">
            </div>

            <div class="droite" id="time" >
            </div>
</div>

答案 1 :(得分:1)

删除display: table;中的#aszone,然后分别将float: leftfloat: right添加到.gauche.droite

https://jsfiddle.net/qsdtfztf/

答案 2 :(得分:0)

许多浏览器都有默认样式,就像chrome中的body元素周围总是有8px的边距一样。所以你应该做的是清除默认样式。

答案 3 :(得分:0)

如:

public class MainActivity extends Activity {
   private RadioGroup radioGroup;
   private RadioButton rButton1,rButton2;
   private Button next;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      radioGroup=(RadioGroup)findViewById(R.id.radioGroup);
      rButton1=(RadioButton)findViewById(R.id.rButton1);
      rButton2=(RadioButton)findViewById(R.id.rButton2);          
      next=(Button)findViewById(R.id.button);

      next.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            if(rButton1.isChecked()){
                Intent intent = new Intent(context, Activity1.class);
                startActivity(intent)
            }else if(rButton2.isChecked()){
             Intent intent = new Intent(context, Activity2.class);
                startActivity(intent)
            }

         }
      });
   }
}