DEV Community

hema latha
hema latha

Posted on

Google project

<!DOCTYPE html>









<br>
.container{<br>
/<em>border: 1px solid;</em>/<br>
height: 200%;<br>
width: 100%; }</p>
<div class="highlight"><pre class="highlight plaintext"><code> body {
background-color: rgb(247, 243, 243);
}
    .header{
        display: flex;
        justify-content: end;
        padding: 1px;
    }
    .header a{
    /* border: 5px solid; */
     margin-right: 17px;
     padding-top: 5px;
     text-decoration: none;
     color: black;
    }
   .header img{
    border-radius: 50%;
   }
   .header a:hover{
    text-decoration: underline;
   }
 .main{
    display:flex;
    flex-direction: column;
    height: 100vh;
    align-items: center;
    justify-content: center;

 }
 .main img{
    width: 300px;
 }
 .main input{
    width: 400px;
    padding: 8px;
    border-radius:25px;
    margin: 15px;
}
.buttons button{
    padding: 10px;
    margin: 5px;
    background-color: white;
    border: 1px solid rgb(29, 28, 28);

}
.buttons button:hover{
    background-color: rgb(173, 173, 173);}
Enter fullscreen mode Exit fullscreen mode

.footer{
display: flex;
justify-content: space-between;
}
.footer .left a{

margin: 10px;
Enter fullscreen mode Exit fullscreen mode

}
.footer .right a{

 margin: 10px;}
 .footer a{
    text-decoration: none;
            }
   .footer a:hover{
   text-decoration: underline;
  }
Enter fullscreen mode Exit fullscreen mode

&lt;/style&gt;

&lt;title&gt;Google&lt;/title&gt;
</code></pre></div>
<p></head><br>
<body></p>
<div class="highlight"><pre class="highlight plaintext"><code>&lt;div class = "header"&gt;
</code></pre></div>
<div class = "right">
<a href="">Gmail</a>
<a href="">image</a>
</div>

<div class = "image">
<img src="https://lh3.google.com/u/0/ogw/AF2bZyiQn3AORtbLOAqTdlhVBOhORuq1yv0C5UIgQMDPiBdOuQ=s32-c-mo">

</div>
<div class="highlight"><pre class="highlight plaintext"><code>&lt;/div&gt;
&lt;div class = "main"&gt;
&lt;img src="https://upload.wikimedia.org/wikipedia/commons/2/2f/Google_2015_logo.svg" alt=""&gt;
</code></pre></div>
<p><input type = "search" placeholder="Search Google or type URL"></p>

<div class = "buttons">
<button>Google search </button>
<button>I am Feeling lucky</button></div>
</div>

&lt;div class = "footer"&gt;
Enter fullscreen mode Exit fullscreen mode

<div class = "left">
<a href="">About</a>
<a href="">Advertising</a>
<a href="">Business</a>
<a href="">How search work</a>

</div>

<div class = "right">
<a href="">Privacy</a>
<a href="">Terms</a>
<a href="">Settings</a>

</div>
<div class="highlight"><pre class="highlight plaintext"><code>&lt;/div&gt;
</code></pre></div>
<p></body><br>
</div><br>
</html></p>

Speedy emails, satisfied customers

Postmark Image

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay