Visual Studio .NET - how to use <div> tag in desing time ?

Asked By Prem Anandh on 21-Oct-08 05:53 AM
i have design my web page using div tag only ..(not use <table>tag only use <div>tag alignment )<div>tag attributes position is not used..how to design my web page?

css - sri sri replied to Prem Anandh on 21-Oct-08 06:02 AM

hi,
you have to use CSS to design the web page by using only <div>

try this

div.link-list {
        width:10.2em;
        position:absolute;
        top:0;
        font-size:80%;
        padding-left:1%;
        padding-right:1%;
        margin-left:0;
        margin-right:0;
}
/* we leave some place on the side using the margin-* properties */
#main {
        margin-left:10.2em;
        margin-right:10.2em;
        padding-left:1em;
        padding-right:1em;
}
/* and then we put each list on its place */
#list1 {
        left:0;
}
#list2 {
        right:0;
}

for more info
http://www.w3.org/2002/03/csslayout-howto

read this link - C_A P replied to Prem Anandh on 21-Oct-08 06:20 AM

http://www.codeproject.com/KB/webforms/DesignTimeSupport.aspx

read this link - C_A P replied to Prem Anandh on 21-Oct-08 06:22 AM

http://www.roseindia.net/struts/struts2/struts2uitags/div.shtml
re - Web Star replied to Prem Anandh on 21-Oct-08 06:25 AM

simply use div tag where u wnat to use as follows

Use the <div> tag to group block-elements to format them with styles.

Browsers usually place a line break before and after the div element

<div style="color:#FF0000;">
<h4>This is a header in a div section</h4>
<p>This is a paragraph in a div section</p>
</div>

see this sample: - Binny ch replied to Prem Anandh on 21-Oct-08 06:41 AM
<div style="width: 100%;">
<div style="width: 99%; margin: auto;">
<div style="background-color: #CCCCCC; width: 33%; padding: 1px; float: left;">&nbsp;</div>
<div style="background-color: #F1F1F1; width: 33%; padding: 1px;  float: left;">&nbsp;</div>
<div style="background-color: #CCCCCC; width: 33%; padding: 1px;  float: left;">&nbsp;</div>
</div>
<div style="width: 99%; margin: auto;">
<div style="background-color: #F1F1F1; width: 33%; padding: 1px;  float: left;">&nbsp;</div>
<div style="background-color: #CCCCCC; width: 33%; padding: 1px;  float: left;">&nbsp;</div>
<div style="background-color: #F1F1F1; width: 33%; padding: 1px;  float: left;">&nbsp;</div>
</div>
</div>
Hope this will help: - Binny ch replied to Prem Anandh on 21-Oct-08 06:42 AM
<html>
<head>
<title>pagetitle</title>
<style type="text/css">
<!--
body {
  margin: 0px;
  padding: 0px;
}
#header {
  width: 100%;
  text-align: center
}
#leftcol {
  float: left;
  width: 20%;
}
#rightcol {
  float: right;
  width: 20%;
}
#content {
  float: left;
  width: 59%;
  text-align: center
}
#footer {
  clear: both;
  width: 100%;
  text-align: center
}
-->
</style>
</head>
<body>
<div id="header">Header</div>
<div id="leftcol">Left Column</div>
<div id="content">Content (Center Column)</div>
<div id="rightcol">Right Column</div>
<div id="footer">Footer</div>
</body>
</html>

Alos see this link:
http://webdesign.about.com/od/htmltags/qt/tipdivtag.htm