Skip to main content

What is the difference between visibility:hidden and display:none in CSS?



visibility:hidden

       -will only hide the content,css but not the space covered by the element.

display:none

      -will hide both the content,css and space covered by that element.

Example:

<html>
<head>
    <style>
        #id2 
        {
            visibility:hidden;
        }
        .class2 
        {
            display:none;
        }
        #id1,#id2,#id3 
        {
            background:#ea6645;
        }
        .class1,.class2,.class3 
        {
            background:green;
        }
    </style>
</head>
<body>

<div id='id1'>First div with attribute ID1</div>
<div id='id2'>Second div with attribute ID2</div>
<div id='id3'>Third div with attribute ID3</div>
<div class='class1'>First div with attribute class1</div>
<div class='class2'>Second div with attribute class2</div>
<div class='class3'>Third div with attribute class3</div>

</body>
</html>




Output:
First div with attribute ID1                                                                                                                          



Third div with attribute ID3



First div with attribute class1



Third div with attribute class3











































Comments











Post a Comment






























Popular posts from this blog



















Send Email(with subject,body,attachment) using SSMTP through Terminal in linux?




























     1.Install ssmtp as                 $ sudo apt-get update && sudo apt-get install ssmtp     2.Configure smtp file by editing the following file as,    $ sudo gedit /etc/ssmtp/ssmtp.conf   Update file with the following:   AuthUser=Sendermail@gmail.com   AuthPass=SenderPasswordforGMAIL   FromLineOverride=YES   mailhub=smtp.gmail.com:587   UseSTARTTLS=YES   Now ssmtp.conf file should look like as the following one,   AuthUser=Sendermail@gmail.com   AuthPass=SenderPasswordforGMAIL   #   # Config file for sSMTP sendmail   #   # The person who gets all mail for userids < 1000   # Make this empty to disable rewriting.   root=postmaster   # The place where the mail goes. The actual machine name is required no   # MX records are consulted. Commonly mailhosts are named mail.domain.com   mailhub=smtp.gmail.com:587   # Where will the mail seem to come from?   #rewriteDomain=   # The full hostname   hostname=tele-desktop118   # A...




















1 comment









Read more




























Backup (or) Download MYSQL Database as a zip file Using PHP




























 NOTE:Please change below credentials  with respect to your Database and Run the file.   <?php  define ( "DB_USER" ,  'DatabaseUSERNAME' ); define ( "DB_PASSWORD" ,  'DatabasePASSWORD' ); define ( "DB_NAME" ,  'DatabaseNAME' ); define ( "DB_HOST" ,  'localhost' ); define ( "BACKUP_DIR" ,  'myphp-backup-files' );  // Comment this line to use same script's directory ('.') define ( "TABLES" ,  '*' );  // Full backup //define("TABLES", 'table1, table2, table3'); // Partial backup of required tables define ( "CHARSET" ,  'utf8' ); define ( "GZIP_BACKUP_FILE" ,  true );   // Set to false if you want plain SQL backup files (not gzipped) class  Backup_Database {     var  $host ;     var  $username ;   ...




















1 comment









Read more




























  How to Integrate SMS API's with PHP?




























    <?php $message  =  "Happy Coding..A Test Message to Check API" ; $students  =  "9999999999"  //your mobile number to test $msg  =  urlencode ( $message );          $url = "http://www.bulksmsapps.com/api/apibulkv2.aspx?apikey=XXX-XXXX-XXXX-XXX-XXXXXXXX&sender=XXXXX&number=" . $students . "&message=" . $msg ; $curl_handle = curl_init (); curl_setopt ( $curl_handle , CURLOPT_URL , $url ); curl_setopt ( $curl_handle , CURLOPT_RETURNTRANSFER , 1 );  curl_setopt ( $curl_handle ,  CURLOPT_FOLLOWLOCATION ,  false ); set_time_limit ( 0 ); $response  =  curl_exec ( $curl_handle ); err  =  curl_error ( $curl_handle ); curl_close ( $curl_handle ); if ( $err ) {     echo  "cURL Error #:"  .  $err ; } else {     echo  $response ; } ?>    ...




















9 comments









Read more