Jump to content
  • 0

Как убрать бордюр родительского элемента?


ObanTM
 Share

Question

Здравствуйте.

Ситуация такая. Блок виджета для сайта на движке wordpress очерчен бордюром слева. Внутри этого блока есть блок названия виджета. Сейчас выдача выглядит так:

widg10.jpg

Что нужно сделать, чтобы левый бордюр у заголовка исчез? Ширины для родительского элемента и заголовка заданы, одинаковые.

Поиграл с z-index, но безуспешно.

Спасибо.

Link to comment
Share on other sites

11 answers to this question

Recommended Posts

  • 0

А если там так:

<div c border> <div>ПОПУЛЯРНОЕ</div> </div>

, то исчезнет граница у всего внешнего div. А я понял, что надо убрать только у заголовка.

Тогда надо по-другому решать данный вопрос.

Но лучше увидеть исходник. Или дайте ссылку на сайт - сами посмотрим.

Link to comment
Share on other sites

  • 0

Там традиционная выдача для Wordpress'овской обработки виджетов:


<div id="%widgetname%" class="box_small box widget widget_%widgetname%">
<h3 class="widgettitle">%widgettitle%</h3>
...
</DIV>

в файлах CSS из указанных классов описываются только два:

в style.css

.box{
width:270px;
overflow: hidden;
margin-bottom:10px;
clear:both;
}

и в style3.css (цветовая схема)

.box {
border-left: 1px solid #eee;
border-bottom: 1px solid #eee;
}

.widgettitle {
color:#cd1713;
width:270px;
text-transform:uppercase;
vertical-align:middle;
font-size:medium;
font-weight:bold;
border-bottom:3px solid #eee;
}

и да, мне нужно убрать левый бордюр только напротив заголовка.

Спасибо!

Link to comment
Share on other sites

  • 0

в Wordpress блок виджета создаётся собственной PHP-функцией register_sidebar () (оформление передается через переменные before_widget, after_widget, before_title, after_title), поэтому поиск тега h3 ничего не даст. Изменить его положение (поставить над div) невозможно без переписывания кода функции.

Поэтому мне интересно, можно ли _средствами CSS_ наложить дочерний блок h3 так, чтобы он затёр левую границу родительского блока div.

И ссылка на мой сайт тут совершенно ни при чем :)

Link to comment
Share on other sites

  • 0

WP не юзал, но исходя из небольшого опыта в Joomla то в php этого виджета должен быть тег h3 или какой вам там нужен, разметка то все равно на HTML.

В joomla если я не находил стили какого либо тега, то искал этот тег в PHP,

плюс бывало такое что стили прописаны в самом файле PHP а не в СSS, к примеру:

echo'<div style=" bla bla bla">';

........

echo'</div>';

через тотал командер поищите id или class этого блока или небольшой кусок кода.

Edited by Modestes
Link to comment
Share on other sites

  • 0

h3.widgettitle {background-color:#fff;position:relative;margin-left:-2px;overflow:visible;}

типа того.

или absolute...что то из этого должно работать.

с relative текст сдвигается и часть первой буквы прячется под границу, но сама граница остаётся

с absolute границу затирает, но на заголовок наползает остальное содержимое блока... (если указать absolute и в описании .box, то вообще всё ломается.

ладно, фокус не удался. Буду придумывать другие варианты оформления.

Всем спасибо :)

WP не юзал, но исходя из небольшого опыта в Joomla то в php этого виджета должен быть тег h3 или какой вам там нужен, разметка то все равно на HTML.

В joomla если я не находил стили какого либо тега, то искал этот тег в PHP,

плюс бывало такое что стили прописаны в самом файле PHP а не в СSS, к примеру:

echo'<div style=" bla bla bla">';

........

echo'</div>';

через тотал командер поищите id или class этого блока или небольшой кусок кода.

Я знаю, что стиль тэга h3 описан (.widgettitle) и что он (тэг) передается в функцию, формирующую виджет, через переменную (т.е. before_title="<h3 class="widgettitle">", after_title="</h3>"), но что дают мне эти знания? :)

Edited by ObanTM
Link to comment
Share on other sites

  • 0

h3.widgettitle {background-color:#fff;position:relative;margin-left:-2px;overflow:visible;}

типа того.

или absolute...что то из этого должно работать.

с relative текст сдвигается и часть первой буквы прячется под границу, но сама граница остаётся

с absolute границу затирает, но на заголовок наползает остальное содержимое блока... (если указать absolute и в описании .box, то вообще всё ломается.

ладно, фокус не удался. Буду придумывать другие варианты оформления.

Всем спасибо :)

WP не юзал, но исходя из небольшого опыта в Joomla то в php этого виджета должен быть тег h3 или какой вам там нужен, разметка то все равно на HTML.

В joomla если я не находил стили какого либо тега, то искал этот тег в PHP,

плюс бывало такое что стили прописаны в самом файле PHP а не в СSS, к примеру:

echo'<div style=" bla bla bla">';

........

echo'</div>';

через тотал командер поищите id или class этого блока или небольшой кусок кода.

Я знаю, что стиль тэга h3 описан (.widgettitle) и что он (тэг) передается в функцию, формирующую виджет, через переменную (т.е. before_title="<h3 class="widgettitle">", after_title="</h3>"), но что дают мне эти знания? :)

к абсолютному

height:30px;

width:Npx;

или к относительному

z-index:1;

и родителю position:relative z-index:2;

(или наоборот,не помню как з-индекс работает.)

Edited by WabFad
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy