News Ticker

Menu
Previous
Next

Latest Post

Webdesign

HTML

CSS

Graphics

Free Downloads

Recent Posts

WordPress website sub menu items divided in to multiple columns - fixed

/ No Comments

How to make wordpress menu divided in to multiple columns the easy way




1: Enable CSS Classes if its not show in in menu list 

2: Go to Appearance > Menus and select the menu you want to edit.

3: Type sub-menu-columns in the top menu item CSS Classes (optional) field.


4: Save menu module

Go to theme CSS page

5: Add bellow block of CSS to your stylesheet
    
    
.submenu { width:410px; } /*You can set width to anything you want */

.sub-menu-columns ul.sub-menu li {
    display: inline-block;
    float: left;
    width: 200px;
}
.sub-menu-columns ul.sub-menu li:nth-child(odd) {
    float: left;
    margin-right: 10px;
}
.sub-menu-columns ul.sub-menu li:nth-child(even) {
    float: right;
}


    
  
You are done!!!

If you know any other options please share on comment box

Wordpress plugin “Contact Form 7” date field not working properly -Fixed

/ No Comments

How to fix "contact form7" plugin date field issue in mozilla and other browser


Try this Plugin  http://wordpress.org/plugins/contact-form-7-datepicker/ .

OR

Please add this code in your theme's functions.php
    
    

 add_filter( 'wpcf7_support_html5_fallback', '__return_true' );

    
  


Changing the Cursor with CSS - CSS cursor property

/ No Comments
The cursor property in CSS controls what the mouse cursor will look like when it is located over the element in which this property is set.

CSS Property

    
    
.auto            { cursor: auto; }
.default         { cursor: default; }
.none            { cursor: none; }
.context-menu    { cursor: context-menu; }
.help            { cursor: help; }
.pointer         { cursor: pointer; }
.progress        { cursor: progress; }
.wait            { cursor: wait; }
.cell            { cursor: cell; }
.crosshair       { cursor: crosshair; }
.text            { cursor: text; }
.vertical-text   { cursor: vertical-text; }
.alias           { cursor: alias; }
.copy            { cursor: copy; }
.move            { cursor: move; }
.no-drop         { cursor: no-drop; }
.not-allowed     { cursor: not-allowed; }
.all-scroll      { cursor: all-scroll; }
.col-resize      { cursor: col-resize; }
.row-resize      { cursor: row-resize; }
.n-resize        { cursor: n-resize; }
.e-resize        { cursor: e-resize; }
.s-resize        { cursor: s-resize; }
.w-resize        { cursor: w-resize; }
.ns-resize       { cursor: ns-resize; }
.ew-resize       { cursor: ew-resize; }
.ne-resize       { cursor: ne-resize; }
.nw-resize       { cursor: nw-resize; }
.se-resize       { cursor: se-resize; }
.sw-resize       { cursor: sw-resize; }
.nesw-resize     { cursor: nesw-resize; }
.nwse-resize     { cursor: nwse-resize; }


    
  

How to set image as Cursor

    
    
.custom-cursor {
  cursor: url(images/my-cursor.png), auto;
}


    
  
Here’s a jsfiddle if you want to see each in demo: http://jsfiddle.net/ewhb866y/1/

HOW TO INCREASE MAXIMUM UPLOAD FILE SIZE CPANEL GODADDY

/ No Comments

How to increase the "Maximum Upload file size IN GODADDY cpanel host, At the time of uploading THEME on my Wordpress site, the installation failed. It turned out that the THEME file was 16MB and the "Total File Upload Size Maximum" on my Wordpress domain was only 2MB. I realized 2MB was default setting that Wordpress is set to so if you have Wordpress installed on your domain and Have GODADDY as your host for that domain, this video is going to teach you exactly how to increase the total File Size upload maximum. Normal method is as change php.ini file as you know If you are using GoDaddy's cPanel hosting the file must be name php.ini or.user.ini After you have created a new php5.ini in to root of your site you need to enter : file_uploads = On post_max_size = 50M upload_max_filesize = 50M HERE I I AM GOING TO TEACH YOU THE ANOTHER METHOD SETTING IS LOCATED IN CPANEL DASHBOARD .. PLEASE WATCH VIDEO THANK YOU VISIT MY WEBSITE http://freelancewebsolutions.net http://jitheshpr.com

Convert an image to grayscale in HTML/CSS

/ No Comments

Convert an image to grayscale in HTML/CSS

Paste below code in to your css file, 

    
        img {
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}

/* Disable grayscale on hover */
img:hover {
  -webkit-filter: grayscale(0);
  filter: none;
}
    
  

Latest Wedding card Designs

/ No Comments
jithesh wedding card design
wedding card design

jithesh wedding card design
Wedding card

jithesh wedding card design
Thanks Card

jithesh wedding card design
Wedding Banner

Freelance web designer from india

/ No Comments
jithesh

I'm Jithesh A Graphic designer and Frontend Developer,

I make website that work on all devices, I'm passion for designing beautiful and functional user experience designs.
Visit my website