Scribd
Upload
28 views

Module2-Advanced Css

Uploaded by

1DT19CS032 Chethana T S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
28 views

Module2-Advanced Css

Uploaded by

1DT19CS032 Chethana T S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Constructing Multi-column layout:-

Techniques for creating multi-column layouts in a web page are:-

i) Using Float

ii) Using position

i) Using Float:-

it is the most common way of creating multicolumns of contents. Consider the given
code and its representation in normal flow.

<html>

<head>

<Title> Dsatm</title>

<style>

#main{ border:1pt solid black; }

</head>

<body>

<h1>cse department</h1>

<figure><img src=”logo.jpg”/>

<div id=”main”>

<p> web programming</p>

<p>machine learning</p>

</div>

<footer>Contact @dsatm.edu.in</footer>

</body> </html>

The above example can be represented diagrammatically as shown below.


After including “float” with the adjustment on left and right margins the layout appears as follows:

nav { … width: 12em; float: left; }

div#main { … margin-left: 220px; }

ii) Using Position:-

You might also like