谷歌應用程序腳本之間的部件寬度

Question

我正在使用谷歌應用程序腳本來創建一個網絡應用程序。你可以看到密碼文本和密碼文本框之間有一個瘋狂的間距。我怎樣才能調整這個間距？

這裏是我的代碼： 功能的doGet（）{VAR 應用= UiApp.createApplication（）;

var mygrid = app.createGrid(2, 2); 
    mygrid.setWidget(0, 0, app.createLabel('Incomplete Challenges').setStyleAttributes(css.Title)); 
    mygrid.setWidget(1, 0, app.createLabel('Password:').setStyleAttributes(css.Inputs)); 
    mygrid.setWidget(1, 1, app.createPasswordTextBox().setName("text")); 

    var mybutton = app.createButton('Submit'); 

    var submitHandler = app.createServerClickHandler('getResults'); 
    submitHandler.addCallbackElement(mygrid); 
    mybutton.addClickHandler(submitHandler); 

    var mypanel = app.createVerticalPanel(); 
    mypanel.add(mygrid); 
    mypanel.add(mybutton); 
    app.add(mypanel); 

    return app; 
} 

在此先感謝。

還有一兩件事，我使用一些CSS在另一個.GS文件...這裏是下面：

var css={}; 
css.Title = { fontFamily:'Fantasy', fontSize:'24px', width: '250', marginTop:'5'}; 
css.Labels = { fontFamily:'Verdana', fontSize:'12px', width: '100', marginTop: '5'}; 
css.Inputs = { fontFamily:'Verdana', fontSize:'12px', width: '70'}; 
css.TextArea = { fontFamily:'Verdana', fontSize:'12px', width: '200', height: '50'}; 
css.PutBorder = {borderStyle: 'solid'}; 

Answer 1

網格是保持相同的寬度跨越列的每一行中的一個小部件。列中最寬的標籤決定了該列的寬度，因此您得到的結果是合乎邏輯的。

你可以簡單地把第一個標籤電網的外象下面這樣：

function doGet(){ 
    var app = UiApp.createApplication(); 
    var mypanel = app.createVerticalPanel().setStyleAttributes(css.mypanel); 
    var mygrid = app.createGrid(2, 2); 
    mypanel.add(app.createLabel('Incomplete Challenges').setStyleAttributes(css.Title)); 
    mygrid.setWidget(0, 0, app.createLabel('Password:').setStyleAttributes(css.Inputs)); 
    mygrid.setWidget(0, 1, app.createPasswordTextBox().setName("text")); 

    var mybutton = app.createButton('Submit'); 

    var submitHandler = app.createServerClickHandler('getResults'); 
    submitHandler.addCallbackElement(mygrid); 
    mybutton.addClickHandler(submitHandler); 

    mypanel.add(mygrid); 
    mypanel.add(mybutton); 
    app.add(mypanel); 

    return app; 
} 

var css={}; 
css.mypanel = { padding : '25px'}; 
css.Title = { fontFamily:'Fantasy', fontSize:'24px', width: '250', marginTop:'5'}; 
css.Labels = { fontFamily:'Verdana', fontSize:'12px', width: '100', marginTop: '5'}; 
css.Inputs = { fontFamily:'Verdana', fontSize:'12px', width: '70'}; 
css.TextArea = { fontFamily:'Verdana', fontSize:'12px', width: '200', height: '50'}; 
css.PutBorder = {borderStyle: 'solid'}; 

結果：