Andy R Andy R - 3 months ago 8
CSS Question

HIde a div with a PHP echo statement with CSS

I am using the CSS display:none to hide divs in my html code. It works fine for divs that hold general html content and hides the content.

However, if the div happens to hold a PHP echo statement it does not hide the contents.

HTML

<span class="paginationFull"><?php echo $paginationCtrls;?></span>
<span class="paginationMini"><?php echo $paginationCtrlsMob;?></span>


CSS

.paginationFull{display:none}


Essentially, I am looking to show full pagination controls if in desktop and mini pagination controls if 320px - 420px. I thought that CSS display:none would be a nice easy way to do this. Does anyone, know how to accomplish this? Thanks for any help. Andy ;-)

Answer

There are some good php libraries that can detect whether the user is on their phone or on a desktop. You can then use this to control which nav is used.

Example using http://mobiledetect.net/

include 'Mobile_Detect.php';
$md = new Mobile_Detect();

if($md->isMobile()){
    echo '<span class="paginationMini">' . $paginationCtrlsMob . '</span>';
}else{
    echo '<span class="paginationFull">' . $paginationCtrls . '</span>';
}

display:none should work regardless of whether you have an echo statement inside the <span> tag. The only explanation as to why its not working in your case is if the php variables contain tags that aren't properly closed.

Comments