出于某种原因,div
重叠div
s,因此我的锚链接不起作用。我使用了检查员,似乎有些ID占用了上面那些ID的空间。例如,#meats
也需要#starters
,依此类推。只有在创建新的#starter
或#meat
时才会出现这种情况。我真的很感激理解这里发生了什么。
p{
color: #454545;
}
@media screen and (min-width: 1200px) {
.nav{
font-weight: lighter;
color: black;
}
#sticky {
// flex: 0 0 450px;
// height: 100vh;
// position: sticky !important; /* !important to override Gmaps inline CSS */
// top: 0 !important;
}
// .card-area{
// width: 300px;
// height: 150px
// }
.col-sm-12{
padding: 0px;
}
.title{
text-transform: uppercase;
margin-top: 20px;
h2{
font-weight: lighter;
margin-bottom: 0px;
}
hr{
margin-top: 0px;
margin-bottom: 0px;
color: #454545;
}
}
.card{
justify: space-between;
display:flex;
height:266px;
width: 900px;
margin: 20px 0;
box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
background-color: white
}
.card-image-area{
background-color: white;
height: 100%;
width: 400px;
}
.card-image{
height: 100%;
}
.card-details{
position: relative;
width: 500px;
background-color: white;
margin: 0 20px;
h3 {
width: 100%;
text-align: center;
color: #454545;
text-shadow: none;
text-transform: capitalize;
font-weight: lighter;
}
p{
text-shadow: none;
color: #454545;
font-size: 14px;
opacity: 0.7;
font-weight: lighter;
}
hr{
margin-top: 0px;
}
}
.card-details .description{
padding: 10px;
}
.card-details .price{
// width: 100%;
// height: 100%;
// justify-content: right;
position: absolute;
right: 5px;
bottom: 5px;
color: black;
font-size: 30px;
}
.actions {
position: absolute;
bottom: 10px;
left: 0px;
}
.fa {
width: 20px;
height: auto;
font-size: 20px;
text-shadow: 0.5px 1px 0.7px rgba(0,0,0,0.3);;
}
.fa-minus-circle{
color: #D03538;
}
.fa-minus-circle:hover {
opacity: 0.3
}
.fa-pencil{
color: #454545;
}
.fa-pencil:hover{
opacity: 0.3;
}
}

<div class="container-fluid">
<div class="flex col-sm-3">
<div class="greeting-and-menu">
<h3>Hola <%= current_user.first_name %>!</h3>
<div id= "sticky" class="profile-sidebar">
<%= link_to "Añadir un plato", new_dish_path, class: "btn btn-primary" %>
<ul class="nav">
<li class="active">
<a href="#starters">
<p>Entrantes</p>
</a>
</li>
<li>
<a href="#meats">
<p>Carnes</p>
</a>
</li>
<li>
<a href="#hunting">
<p>Caza</p>
</a>
</li>
<li>
<a href="#fishes">
<p>Pescados</p>
</a>
</li>
<li>
<a href="#classics">
<p>Especialidades</p>
</a>
</li>
<li>
<a href="#desserts">
<p>Postres</p>
</a>
</li>
<li>
<a href="#others">
<p>Otros</p>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="right-part col-sm-9">
<div id="starters">
<div class="title">
<h2>Entrantes</h2>
<hr>
</div>
<% @starters.each do |starter| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if starter.photo? %>
<% img = cl_image_path starter.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= starter.name %></h3>
<hr>
<p class="description"><%= starter.description %></p>
<p class="price"><%= starter.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden= "true"></i>').html_safe, dish_path(starter), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(starter), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="meats">
<div class="title">
<h2>Carnes</h2>
<hr>
</div>
<% @meats.each do |meat| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if meat.photo? %>
<% img = cl_image_path meat.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= meat.name %></h3>
<hr>
<p class="description"><%= meat.description %></p>
<p class="price"><%= meat.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(meat), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(meat), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="hunting">
<div class="title">
<h2>Caza</h2>
<hr>
</div>
<% @hunting.each do |hunt| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if hunt.photo? %>
<% img = cl_image_path hunt.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= hunt.name %></h3>
<hr>
<p class="description"><%= hunt.description %></p>
<p class="price"><%= hunt.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(hunt), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(hunt), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="fishes">
<div class="title">
<h2>Pescados</h2>
<hr>
</div>
<% @fishes.each do |fish| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if fish.photo? %>
<% img = cl_image_path fish.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= fish.name %></h3>
<hr>
<p class="description"><%= fish.description %></p>
<p class="price"><%= fish.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(fish), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(fish), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="classics">
<div class="title">
<h2>Especialidades</h2>
<hr>
</div>
<% @classics.each do |classic| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if classic.photo? %>
<% img = cl_image_path classic.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= classic.name %></h3>
<hr>
<p class="description"><%= classic.description %></p>
<p class="price"><%= classic.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(classic), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(classic), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="desserts">
<div class="title">
<h2>Postres</h2>
<hr>
</div>
<% @desserts.each do |dessert| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if dessert.photo? %>
<% img = cl_image_path dessert.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= dessert.name %></h3>
<hr>
<p class="description"><%= dessert.description %></p>
<p class="price"><%= dessert.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(dessert), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(dessert), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
<div id="others">
<div class="title">
<h2>Otros</h2>
<hr>
</div>
<% @others.each do |other| %>
<div class="col-sm-12">
<div class="card">
<div class="card-image-area">
<% if other.photo? %>
<% img = cl_image_path other.photo, :width=>400, :height=>266, :crop=>"fill" %>
<% else %>
<% img = cl_image_path("nofoto_zaytwc", :width=>400, :height=>266, :crop=>"fill") %>
<% end %>
<div class="card-image img-responsive img-rounded" style="background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.2)), url(<%= img %>)">
</div>
</div>
<div class="card-details img-rounded img-responsive">
<h3 class="text-centre"><%= other.name %></h3>
<hr>
<p class="description"><%= other.description %></p>
<p class="price"><%= other.price %> €</p>
<div class="actions">
<%= link_to ('<i class="fa fa-minus-circle aria-hidden="true"></i>').html_safe, dish_path(other), method: :delete, data: { confirm: "Seguro que quieres eliminar este plato?" } %>
<%= link_to ('<i class="fa fa-pencil aria-hidden="true"></i>').html_safe, edit_dish_path(other), method: :get %>
</div>
</div>
</div>
</div>
<% end %>
</div>
</div>
</div>
&#13;
答案 0 :(得分:0)
我认为您使用的后端代码和条件存在问题。我检查了你的代码,如果条件没有工作正常。
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_pass"
android:layout_width="match_parent"
android:layout_height="37dp"
android:layout_marginTop="10dp"
android:layoutDirection="rtl"
android:src="@drawable/ic_https_grey600_18dp"
app:hintEnabled="false"
app:passwordToggleEnabled="true">
<EditText
android:id="@+id/password"
style="@style/edittexts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableLeft="@drawable/ic_https_grey600_18dp"
android:drawableStart="@drawable/ic_https_grey600_18dp"
android:hint="رمز عبور"
android:gravity="right|center_vertical"
android:imeOptions="actionDone"
android:inputType="textPassword"
android:transformPivotX="10dp"
app:passwordToggleEnabled="true" />
</android.support.design.widget.TextInputLayout>