Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Articles by Lakshmi Srinivas
Page 5 of 24
CSS padding-top property
The padding-top CSS property specifies the top padding of an element. It creates space between the element's content and its top border. This property accepts values in pixels, percentages, em units, or other CSS length units. Syntax padding-top: value; Values The padding-top property accepts the following values: Length values: px, em, rem, cm, etc. Percentage: Relative to the width of the containing block inherit: Inherits from parent element initial: Sets to default value (0) Example with Length Values ...
Read MoreAndroid 4.0.1 breaks WebView HTML 5 local storage?
Android 4.0.1 introduced stricter security policies that can break HTML5 local storage in WebView components. This issue primarily affects apps targeting older Android versions when loading local HTML content. The Problem For Android versions less than 4.4, loading data into a WebView with a file scheme as a directory won't enable local storage properly: // This approach fails on Android 4.0.1 browser.loadDataWithBaseUrl("file:///android_asset/", html, "text/html", "UTF-8", null); Solution 1: Add Filename to Base URL Adding a specific filename to the base URL resolves the local storage issue on older Android versions: // ...
Read MorejQuery Mobile: Sending data from one page to the another
jQuery Mobile provides several methods to pass data between pages. The most common approaches include URL parameters, localStorage, and sessionStorage. Method 1: Using URL Parameters Pass data through the URL query string when navigating between pages. HTML Link with Parameters Go to New Page JavaScript to Extract Parameters $(document).on("pageinit", "#new", function(event) { // Get URL parameters var url = $(this).data("url"); if (url) { ...
Read MoreUsage of margin-bottom property with CSS
The margin-bottom CSS property specifies the bottom margin of an element, creating space below it. It accepts values in pixels, percentages, ems, or the keyword auto. Syntax margin-bottom: length | percentage | auto | initial | inherit; Parameters length - Fixed value in px, em, rem, etc. percentage - Relative to parent element's width auto - Browser calculates the margin automatically initial - Sets to default value (0) inherit - Inherits from parent element Example: Basic margin-bottom Usage ...
Read MoreDrop target listens to which events in HTML5?
To accept a drop in HTML5, a drop target must listen to at least three essential events that handle the drag-and-drop sequence. Required Events for Drop Targets The dragenter event, which is used to determine whether the drop target is to accept the drop. If the drop is to be accepted, then this event has to be canceled. The dragover event, which is used to determine what feedback is to be shown to the user. If the event is canceled, then the feedback (typically the cursor) is updated based on the dropEffect attribute's value. Finally, the drop ...
Read MoreStyle unordered lists markers with CSS
The list-style-type property allows you to control the shape or style of unordered list markers. This CSS property provides various options to customize how list items appear. Syntax ul { list-style-type: value; } Common list-style-type Values Value Description Marker disc Default filled circle ● circle Empty circle ○ square Filled square ■ none No marker - Example: Square Markers ...
Read MoreChrome input type="number" CSS styling
Chrome provides special CSS pseudo-elements to style the spinner arrows in input type="number" fields. You can hide them completely or customize their appearance. Hiding the Number Input Spinner To completely remove the spinner arrows from number inputs: input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type=number] { ...
Read MoreTouchmove pointer-events: none CSS does not work on Chrome for Android 4.4 / ChromeView
The pointer-events: none CSS property doesn't work properly on Chrome for Android 4.4 (ChromeView) for touchmove events. This causes issues when trying to disable touch interactions on overlay elements. The Problem On Chrome for Android 4.4, elements with pointer-events: none still receive touchmove events, breaking the expected behavior where these elements should be non-interactive. Solution: Using touchstart with preventDefault() Instead of relying on CSS pointer-events: none, use JavaScript to handle and prevent touch events: Overlay Content const overlay = document.getElementById('overlay'); // Prevent all touch interactions overlay.addEventListener('touchstart', function(ev) ...
Read MoreWorking with tag in HTML5
The tag in HTML5 SVG allows you to create multi-sided shapes by defining a series of connected straight lines. It's perfect for creating geometric shapes like triangles, stars, and other polygonal figures. Syntax Key Attributes The points attribute defines the polygon's vertices as coordinate pairs (x, y), separated by spaces or commas. Other common attributes include fill, stroke, and stroke-width. Example: Creating an SVG Star ...
Read MoreHow to set the height of an element with JavaScript?
Use the style.height property to dynamically set the height of HTML elements with JavaScript. This property accepts height values in pixels, percentages, or other CSS units. Syntax element.style.height = "value"; Where value can be in pixels (px), percentages (%), or other CSS units like em, rem, vh, etc. Example: Setting Button Height Heading 1 This is Demo Text. Update Height ...
Read More