Изменение столбца с помощью таблицы (CSS) - PullRequest
1 голос
/ 07 апреля 2011
middle += "<tr class='tRow'>"
               + "<td>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + gallery 
                  + "</a>"
               + "</td>"
               + "<td class='title'>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + ""+ (output.get(i).get("title")).replaceAll("\"","\'\'")+"" // replaces quatations into '

                  + "</a>"
               + "</td>"
               +

Таблица стилей должна воздействовать на столбец с именем title (имя класса), чтобы уменьшить ширину столбца. Только этот единственный столбец должен быть затронут. Есть еще столбцы. Это CSS:

td.title{
          width:18%;
         }

Но этот CSS влияет на все столбцы в таблице. Это влияет на ширину остальных столбцов, но некоторые из них имеют ширину, отличную от указанной в CSS. Я пробовал встроенную таблицу стилей, но все равно она влияет на все столбцы. В чем проблема? Приветствия

Дополнительные детали: private String getBeginning (int tableNumber) {

      return "<html><head><title>"+ (tableNumber - 1)+"</title>"

          + "</head><body>"
          + "<table id='example' class='tablesorter' cellpadding='3' >" // border='1' cellpadding='1' cellspacing='2'
          + "<thead>"
                 + "<tr class='tHead'>"
                       + "<th/>"
                       + "<th>Title</th>"
                       + "<th>Total Price</th>"
                       + "<th>Currency</th>"
                       + "<th>Condition</th>"
                       + "<th>Location</th>"
                       + "<th>End Time</th>"
                       + "<th>Map</th>"
                + "</tr>"
          + "</thead>"
          + "<tbody>";
}


       middle += "<tr class='tRow'>"
               + "<td>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + gallery 
                  + "</a>"
               + "</td>"
               + "<td class='title'>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + ""+ (output.get(i).get("title")).replaceAll("\"","\'\'")+"" // replaces quatations into '

                  + "</a>"
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("total") +""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("currency")+""
               + "</td>"
               + "<td>"
                  + ""+condition+""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("location")+""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("endTime").split("T")[0]+""
               + "</td>"
               + "<td>"
               + "<a href='" + getMap(location, postCode, "0") + "'>"
               + "<img src='" + getMap(location, postCode, "1") + "'> "
               +"</a>"
               + "</td>"
               + "</tr>";

String end = "";

Я запускаю это веб-приложение на Firefox 3.6.11. Не пытался запустить его в разных браузерах.

1 Ответ

1 голос
/ 07 апреля 2011

Здесь важно отметить, что процентные значения относятся к количеству места, доступного для таблицы, а не для страницы или содержащей div.Попробуйте использовать абсолютное значение, например 200.Это также может усложнить ситуацию, если в таблице уже установлено значение width, означающее, что вы не позволяете браузеру решать, насколько широким он будет в итоге.

Не видя оставшуюся часть кода и не зная, какой контексттаблица находится, или если у вас установлена ​​ширина на самой таблице, я могу вам сказать, что установка ширины для одного столбца, когда для самой таблицы установлена ​​ширина, изменит ширину других столбцов, когда они приближаются кзаполнить пространство.В этой ситуации, как правило, рекомендуется разрешить размер ячеек самостоятельно, поскольку алгоритм, используемый для задания ширины, очень динамичен.В качестве альтернативы вы можете быть очень строгими и установить ширину каждого столбца в точности так, как вы хотите, чтобы он отображался.

Чтобы прочитать тему, см. спецификацию HTML.

...