Вопрос о родительском дочернем элементе CSS3 border-radius

Допустим, у меня есть этот css,

#wrap {width: 190px; padding: 0 10px; border-radius: 10px; background: #000;}
#wrap a {width: 190px; padding: 10px; display: block;}
#wrap a:hover {background: #fff;}

И этот html,

<div id="wrap">
<ul>
<li><a href="#">Some Link 1</a></li>
<li><a href="#">Some Link 2</a></li>
<li><a href="#">Some Link 3</a></li>
<li><a href="#">Some Link 4</a></li>
</ul>
</div>

Теперь ссылки точно помещаются в #wrap, но #wrap имеет радиус границы и черный фон. Поскольку при наведении курсора ссылки имеют белый фон, первый дочерний элемент и последний дочерний элемент располагаются над углами радиуса границы. Но когда они сидят сверху , фон #wrap скрывается, скрывая border-radius.

Я знаю, что могу назначить радиус границы первому и последнему дочерним элементам, но есть ли более простой способ сделать это?

Бывают случаи, когда назначение радиуса границы первому и последнему дочерним элементам не сработает, скажем, если я хотел, чтобы это было в моей обертке div,

padding: 5px 10px;

Тогда, даже если я назначу радиус границы, они не будут соответствовать, что сделает его некрасивым. <...

У меня есть следующий LinearLayout ...

<LinearLayout android:id="@+id/linearLayout3" android:visibility="invisible" android:layout_width="wrap_content" android:layout_height="wrap_content">
<TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/S"></TextView>
<TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/b"></TextView>
<TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/Ar"></TextView>
</LinearLayout>

Я установил видимое невидимое, но LinearLayout все еще занимает место, вызывая отступы между двумя другими линейными макетами в макете, почему? Как сделать так, чтобы он не занимал места?

18
задан James Goodwin 9 December 2013 в 16:28
поделиться