CSS идентификаторы и вложенные теги с Haml - PullRequest
Новая
       10

CSS идентификаторы и вложенные теги с Haml

0 голосов
/ 27 апреля 2010

В моем файле CSS есть следующий код, который не работает. 

#home table th td {
  border:1px solid black;
  padding:2px;
}

В моем файле index.haml у меня есть: 

%div{:id => "home"}
  %table
    %tr
      %th
        Your Account
    %tr
      %td
        #{link_to 'View my profile', @profile}
        %br
        #{link_to 'Edit my profile', edit_profile_path(@profile)}
        %br
        #{link_to 'Logout', :controller => 'admin', :action => 'logout'}

Это создает этоИсточник страницы (я знаю, избыточно. Но просто чтобы быть точным): 

<div id='home'>
  <table>
    <tr>
      <th>
        Your Account
      </th>
    </tr>
    <tr>
      <td>
        <a href="/profiles/7">View my profile</a>
        <br />
        <a href="/profiles/7/edit">Edit my profile</a>
        <br />
        <a href="/admin/logout">Logout</a>
      </td>
    </tr>
  </table>
</div>

Но границы не отображаются при просмотре файла в браузере ...

КогдаЯ разделяю табличные теги так, чтобы они были 

#home table {
      border:1px solid black;
      padding:2px;
    }

#home th {
      border:1px solid black;
      padding:2px;
    }

#home td {
      border:1px solid black;
      padding:2px;
    }

Выглядит хорошо.

Что не так с предыдущим кодом CSS по сравнению с этой версией?Как правильно свернуть эти теги в один идентификатор?

1 Ответ

1 голос
/ 27 апреля 2010

Следующая проблема, которую вы можете использовать

Для заголовка: 

#home table tr th {
  border:1px solid black;
  padding:2px;
}

Для ячейки таблицы: 

#home table tr td {
  border:1px solid black;
  padding:2px;
}

Для более подробной информации проверьте: http://www.w3schools.com/css/default.asp

...