i have the following <svg> in an AngularJS template and the image source would be assigned by the controller which loaded the image info from a .json file.
If you have a sticky header (Position fixed header on the top of the html page), your anchor link with CSS ID would not work as you expected. The target section would be covered by the position fixed header.
You can use the following CSS to offset the fixed header height.
/* The target CSS ID with :before pseudo class */
.offset:before {
display: block;
content: " ";
height: 150px; /* Give height of your fixed element */
margin-top: -150px; /* Give negative margin of your fixed element */
visibility: hidden;
}
But instead of rating by stars, i would like to create a number rating widget. So i modified the example a bit. First, create a image as follow.
icon_number_widget.png Continue reading CSS – Number rating widget→
Google Forms is a very common way to collect user data nowadays. After you have created the form, you could insert it to your web site and present it with your own style.
Other than that, we could integrate Google Forms with the backend job since we could submit the form through command line. Let’s take a look on the following example.
1. Create a new form on your Google drive. The edit page url should be in the following format.
For iPhone users, when you are viewing a website on Safari and switch the screen orientation from portrait to landscape, you will find that the content of the page will be scaled automatically to fit the screen width. This maybe a nice feature but probably not good for responsive design.
To disable the auto scaling, you can add the following meta on your HTML inside the <head> tag.