2016-02-23 2 views
0

Я не могу изменить ширину заголовка строки, используя удобную электронную таблицу. Я пробовал CSS, на который ссылаются в этом сообщении: Handsontable increase row header width: Из того, что я читал, вы не можете просто использовать rowWidths, как столбцы, но вам нужно войти в CSS самого заголовка строки.Как изменить ширину заголовка строки?

.handsontable col.rowHeader { 
    width: 180px; 
} 

Picture of the problem.

CSS здесь:

html { 
    background-color: #e6e9e9; 
    background-image: -webkit-linear-gradient(270deg,rgb(230,233,233) 0%,rgb(216,221,221) 100%); 
    background-image: linear-gradient(270deg,rgb(230,233,233) 0%,rgb(216,221,221) 100%); 
    -webkit-font-smoothing: antialiased; 
} 

body { 
    margin: 0 auto; 
    padding: 2em 2em 4em; 
    max-width: 800px; 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 16px; 
    line-height: 1.5em; 
    color: #545454; 
    background-color: #ffffff; 
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.06); 
} 


a { 
    color: #34A9DC; 
    text-decoration: none; 
} 

p { 
    margin: 5px 0 20px; 
} 

h4 { 
    margin: 20px 0 0; 
    font-size: 22px; 
    font-weight: normal; 
} 


.topcorner { 
    position:relative; 
     float:right; 
     top:0px; 
     right:16px; 
} 

#total { 
    font-size: 20px; 
    margin: 2 auto; 
    padding: 4em 4em 4em; 
} 


.handsontable col.rowHeader { 
    width: 180px; 
}` 

Вот в JS для таблицы:

var hot = new Handsontable(container, 
{ 
    data: getData(), 
    colHeaders: ["Quantity","Cost","Amount"], 
    rowHeaders: ["Flights", 
       "Taxi & Bus", 
       "Hotel(nights, cost/night)", 
       "Breakfast & Lunch", 
       "Dinners", 
       "Museum Tickets", 
       "Live Show Tickets", 
       "Driving(miles, cost/mile)"], 
    manualColumnResize: true, 
    columns: [ 
     { 
     data: 'quantity', 
     type: 'numeric', 
     language: 'en' 
     }, 
     { 
     data: 'cost', 
     type: 'numeric', 
     format: '$0,0.00', 
     language: 'en' 
     }, 
     { 
     data: 'amount', 
     type: 'numeric', 
     format: '$0,0.00', 
     language: 'en' 
     } 
    ], 
     colWidths:[80,120,150] 

    }); 

HTML DIV Я использую: <div id="example" class="handsontable"></div>

+0

Что значит «col.rowHeader»? вы можете показать больше своего кода, чтобы я мог вам помочь –

+0

Да, только что отредактировал его, извините. – mappy

ответ

0

Вы не предоставили какой-либо достаточно Информация. Все, что я мог предложить, это то, что;

  • ваш CSS не достаточно специфичны и там не отвергая все, что CSS поставляется с библиотекой handsontable
  • вы используете неправильный селектор и, следовательно, CSS не применяется.

EDIT: Можете ли вы попробовать CSS ниже;

.ht_clone_left.handsontable tbody tr th { width: 180px; } 
+0

Извините, просто обновил его, надеюсь, этого достаточно – mappy

Смежные вопросы