CSS select div без элементов

Question

Мне нужно сделать DIV, который имеет текст, но никаких дочерних элементов, невидимых с CSS, есть ли способ сделать это?

если это HTML сделать узел видимый

<div class="pages_available_text" style=""> 
         1 
    <a href="javascript: void(0);" onclick="Add_Search_Param('page', 2); return Refine();">2</a> 

    <a href="javascript: void(0);" onclick="Add_Search_Param('page', 3); return Refine();">3</a> 

</div> 

, но если это HTML-

<div class="pages_available_text"> 
         1 
</div> 

он должен скрыть DIV (: пусто не будет работать, потому что ДИВ содержит текст)

Answer 1

Обходной путь (но не удаляет div используемое пространство, просто сделайте текст невидимым), оберните текст span (поскольку TextNode не может быть выбран используя css), затем скройте его с помощью :only-child селектор:

<style> 
    .pages_available_text > :only-child { 
    display:none; 
    } 
</style> 

<div class="pages_available_text"> 
    <span class='num'>1</span> 
    <a href="javascript: void(0);" onclick="Add_Search_Param('page', 2); return Refine();">2</a> 
    <a href="javascript: void(0);" onclick="Add_Search_Param('page', 3); return Refine();">3</a> 
</div> 

<div class="pages_available_text"> 
    <span class='num'>1</span> 
</div><!-- the span won't show -->