April 17, 2012

Table breaks when printing

Question by iceteea

I have a site with some tables on it (with thead & tbody).
This site shall be printed with the latest firefox.
Problem: sometimes firefox breaks the page within one of the tables,
the printed version of the site is unusable.
Couldn’t find any working solution yet.

Answer by Starx

This shall fix the problem

table { 
   page-break-before: always;
} 

Update::

On that case, use the folloing

@media print {
    table {
       page-break-inside:avoid;
    }
}
March 24, 2012

Setting Height to 100% Not Working and Unknown CSS Change

Question by user1249318

I’m working on http://pizzli.com/darrenwp/?p=107. When I try and set the post background height to 100% to extend the background to the entire length of the post, it doesn’t work, however changing the number of pixels does. One other problem is the HTML> seemed to set a Margin-Top: 28px !important and I’m not sure where this is coming from. Any help would be appreciated.

Answer by sandeep

If there is a float in an element so you have to clear his parent. write now inside #postbg the child have float on it so we have to clear it. Write like this:

#postbg {
    overflow: hidden;
}

Answer by Starx

margin-Top: 28px !important 

Is for the workpress bar on the top of the page. Its not the problem.

March 17, 2012

Site directory Organizing

Question by user1275456

hi i want to know is there any way to sort folders in website as i want them to be,

i want to sort these in dreamweaver and also on server.
right now my website is not live as it is in development process and it will go live on completion,

also want to tell that majority of my pages are going yo be static.

i know to place a folder on top i can add underscore as prefix but i dont want underscore to display in url so i cannot use it.

is there any way to sort folders manually

Answer by Starx

This totally depends on the developer and his point of view. Do what makes it comfortable to manage and organise the files.

January 9, 2011

Light HTML webpage designer to use along side netbeans on my mac?

Question by LondonGuy

I would like to know if there is a plugin for netbeans that would make it easy for me to edit html and build simple temp pages while coding so I can place things in the right place on my page etc..

If there isn’t a plugin is there any lightweight HTML webpage editor I could use?

Thanks in advance..

I also don’t mind buying..

Answer by Starx

Lightweight HTML Editor? :O

Try http://brandonsoft.com/htmlide/

July 7, 2010

how to combine these 2 jquery code into one

Question by Jitendra Vyas

Should work same as it’s working independently.

This

(function($) { 
     $(document).ready(function(){
          $('#number1').hide();
        $('.button1').click(function(){
              $('.table1').slideToggle();
        $(this).toggleClass("minus_icon"); 
                return false;
   });
});

})(jQuery);

and this

(function($) { 
     $(document).ready(function(){
          $('#number2').hide();
        $('.button2').click(function(){
              $('.table2').slideToggle();
        $(this).toggleClass("minus_icon"); 
                return false;
   });
});

})(jQuery);

both will be used on same page.

Thanks

Edit: Added after @Felix comment

@Felix – Do you mean like this?

(function($) { 
     $(document).ready(function(){
          $('#number2, #number1').hide();
        $('.button2').click(function(){
              $('.table2').slideToggle();
        $(this).toggleClass("minus_icon"); 
                return false;
   });
});
        $('.button1').click(function(){
              $('.table1').slideToggle();
        $(this).toggleClass("minus_icon");
                return false;
   });
})(jQuery);

Answer by Starx

A sample HTML

<button id="button1" class="btn" div="table1">Table 1</button>
<button id="button2" class="btn" div="table2">Table 2</button>
<div class="myDiv" id="div1"><table><tr><td>Table1</td></tr></table></div>
<div class="myDiv" id="div2"><table><tr><td>Table2</td></tr></table></div>

CSS

  .myDiv { display:none; }

Jquery

 $(document).ready(function(){

    $('.btn').click(function(){
        //identify same class to all your div for example in this case I will define all tables as myDiv
        // doing this will not fix the effect to just two tables
        $(".myDiv").slideUp(); //Hide all divs first

        $('#'+$(this).attr("div")).slideToggle(); //show the required
        $(this).toggleClass("minus_icon");
        return false;
    });
});
May 27, 2010

How to show hidden div when javascript is disabled?

Question by Jitendra Vyas

I’m hiding a div using display:none and this div only shows when we click on + icon. but if JavaScript is disabled then I want to show that div by default on. How to do this?

I can’t post whole code for now.

jQuery(document).ready(function() {
  jQuery('a#toggle').click(function() {
       jQuery('#map').slideToggle(400);
       return false;

});

CSS

#map {display:none}

Answer by deceze

Only hide it if Javascript is enabled:

<head>
    <script type="text/javascript" charset="utf-8">
        document.write('<style type="text/css" media="screen">#map { display: none; }</style>');
    </script>
</head>

Answer by Starx

I think

<noscript>Your browser does not support JavaScript!</noscript>

This would be a better idea that other

Put the division you want to show if the javascript is not enable inside <noscript> tags

...

Please fill the form - I will response as fast as I can!