Дата не отображается должным образом в Liferay портлета

Question

В моем портлета У меня есть одна форма, где я показываю даты через следующий код

JSP:

<aui:input type="text" name="createdDate" size="10" value="" id="createdDate" label="" /> 
     <div class="calendar-icon" id="imageDiv"> 
<span class="aui-icon aui-icon-calendar"></span> 
</div> 

Script в JSP

renderCalendar('#imageDiv','#<portlet:namespace/>createdDate','#calendarDiv'); 
function renderCalendar(imageDiv,inputDisplay,calendarDiv) { 
    AUI().ready('aui-calendar', function(A) { 
    var inputField1 = A.one(imageDiv); 
    var inputField2 = A.one(inputDisplay); 

    var calendar1 = new A.Calendar({  
     dates: [ new Date() ], 
     dateFormat: '%d/%m/%Y',  
     selectMultipleDates: false,   
     after: {       
      datesChange: function(event) {   
         var formatted = event.target.getFormattedSelectedDates();  
         inputField2.val(formatted); 
         calendar1.toggle(); // hide after a date was selected   
        }   
       } 
    }).render(calendarDiv); 

    var boundingBoxCal1 = calendar1.get('boundingBox'); 
    boundingBoxCal1.setX(inputField1.getX());   
    boundingBoxCal1.setY(inputField1.getY() + 25);  
    calendar1.hide(); 
    inputField1.on('click', function() { calendar1.toggle(); });   
}); 
} 

Он показывает дату на странице, но проблема заключается в макете Текстовое поле даты и значок календаря, которые не входят в ту же строку. Пожалуйста, помогите мне

Answer 1

<span> вместо <div>. <div> открывает новый блок, в то время как <span> останется в одной строке

Answer 2

Странно, что <span> не исправить вашу проблему. Попробуйте поплавать <div> влево, как в,

<div class="calendar-icon" id="imageDiv" style="float: left;">