🚀 Hurry! Offer Ends In
00 Days
00 Hours
00 Mins
00 Secs
Enroll Now
X
Questions
Write a code to create following using html:
Write a code to generate following using html:
O Level Practical Viva Questions and Answers
Write a HTML program to implement Formatting tags.
Create a Web Page in which the text " WEB DESIGNING AND PUBLISHING " should scroll in different directions for four times .
Write a Java Script program to print Factorial of a given number.
Create a web page to display the following output:
Create a web page to display 3 images which are aligned left, right and center respectively.
Write a program using java script to accept a Name from user and display it.
Write down the names of any four states of India using all types of list i.e. ordered list, unordered list and definition list. The page should have background colour. The text colour of each type of the list should be different.
Write a program to create html table having border and alternate columns background colors using CSS. Final Output should be like this.
Write html code to generate following output. • Coffee • Tea • Black Tea • Green Tea • Milk
Create a Restaurant Menu Card using HTML and CSS.
Write HTML Code to demonstrate the use of Anchor Tag for the Following:- 1. Creating a web link that opens in a new window. 2. Creating a web link that opens in the same window. 3. C Reference within the same html document. 4. Reference to some image. 5. Making an image a hyperlink to display second image
What do you mean by <Select> tag? Design a web page with 4 Select tag with 4 option each?
Design Simple Registration form with First Name, Last Name, Password, EMail Id, Phone No, Address, Gender, DOB in the personal details section and Degree, Engineering Branch, Signature, Photo and Resume upload in Educational Details section.
Design a Simple table with First name, Last Name, marks, Roll No. & Course using W3.CSS.
a) Write HTML program with title Student Information: b) Write Name of college in large font. c) Write address in small font. d) Write course name with different background color of each course. e) Insert image in background
Write JS to find prime numbers, even numbers, and odd numbers between 1 to 100.
PRACTICAL-PR1 PRACTICAL-PR2 PRACTICAL-PR3 PRACTICAL-PR4

Create a web page to display 3 images which are aligned left, right and center respectively.

Last Updated : 16 Jul 2025 Jul 22

Solution: 

<!DOCTYPE html>
<html>
<head>
    <title>Image Alignment</title>
    <style>
        .container {
            width: 100%;
            text-align: center; /* Center-aligns the container content */
        }
        img{
        height:60px;
        width:100px
        }
        .left {
            float: left;
        }
        .right {
            float: right;
        }
        .center {
            display: inline-block; /* Keeps the image centered within the container */
        }
    </style>
</head>
<body>
    <div class="container">
        <!-- Image aligned to the left -->
        <img src="https://examjila.com/public/assets/images/courses/olevelwebdesigning.png" alt="Left Image" class="left">

        <!-- Image aligned to the center -->
        <img src="https://examjila.com/public/assets/images/courses/olevelwebdesigning.png" alt="Center Image" class="center">

        <!-- Image aligned to the right -->
        <img src="https://examjila.com/public/assets/images/courses/olevelwebdesigning.png" alt="Right Image" class="right">
    </div>
</body>
</html>

OUTPUT:

 

Code Explanation:

  • Container Styling (.container):

    • text-align: center;: Centers the inline content (like images) within the container.

  • Image Styling (img):

    • height: 60px;: Sets the height of all images.
    • width: 100px;: Sets the width of all images.

  • Image Alignment Classes:

    • .left:
      • float: left;: Aligns the image to the left side of the container.
    • .right:
      • float: right;: Aligns the image to the right side of the container.
    • .center:
      • display: inline-block;: Makes the image behave like an inline element, allowing it to be centered within the container.
Report an error
Latest Updates