 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
nishanthaMe
Joined: 14 May 2008 Posts: 3
|
Posted: Sun May 18, 2008 1:37 am horizontal divs |
|
|
|
<html>
<head><title>mypage</title>
</head>
<body>
<div id="first">
<div> first div</div>
<div> second div</div>
</div>
</body>
</html>
Out put of this code appers as follows
first div
second div
But I want the out out as
second div frist div
and the above out put should be right hand side of the browser.
So I would be very thank full if anyone can give me an ide
cheers
Nishantha |
|
sticks464
Joined: 31 Dec 2006 Posts: 1179
|
Posted: Sun May 18, 2008 4:28 am |
|
|
|
Since there is apparently no css, the divs will assume 100% width of the viewport therefore the only way to get content on the right side is to do text-align:right. From the code you posted, no one can tell if you want the divs to be full width one after the other or a set width with columns. As you currently have the code, all you have to do to get the second div first is
| Code: |
<div id="first">
<div> second div</div>
<div> first div</div>
</div> |
and the css
| Code: |
<style type="text/css">
#first {text-align:right;}
</style> |
|
|
Straystudio
Joined: 14 Apr 2008 Posts: 261 Location: Nord Italy
|
Posted: Sun May 18, 2008 4:36 am DIV float property |
|
|
|
I know TWO ways; more than words, I'll give some patterns to be processed.
- STYLE. Allowing some Elements to float: left/right;
| Code: |
<html>
<head><title>mypage</title>
</head>
<body>
<div id="first">
<div style="float: left;"> first div</div>
<div style="float: right;"> second div</div>
</div>
</body>
</html>
|
Also is possible giving both DIVs the same orientation:
| Code: |
<html>
<head><title>mypage</title>
</head>
<body>
<div id="first">
<div style="float: right;"> first div</div>
<div style="float: right;"> second div</div>
</div>
</body>
</html>
|
Since it does not exist float: center; I worked out this as well:
| Code: |
<html>
<head><title>mypage</title>
</head>
<body>
<div id="first">
<div style="float: left;"> first div</div>
<div style="float: right;"> second div</div>
<div align="center"> third div</div>
</div>
</body>
</html>
|
- TABLE. Placing DIVs inside table cells:
| Code: |
<html>
<head><title>mypage</title>
</head>
<body>
<div id="first">
<table height="" width="100%" border="1" cellpadding="0" cellspacing="0"><tr>
<td width="30%" align="left">
<div style=":;"> first div</div>
</td>
<td width="30%" align="center">
<div style=":;"> second div</div>
</td>
<td width="30%" align="right">
<div> third div</div>
</td></tr>
</table>
</div>
</body>
|
As lons as You do not write </TR><TR> to start a new horizontal line of cells, cells keep staying on the same row with their content as well.
|
|
sticks464
Joined: 31 Dec 2006 Posts: 1179
|
Posted: Sun May 18, 2008 10:49 am |
|
|
|
Here's how I would do the page. Make the two images at the top into one 850 X 270. Then the following code
| Code: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>The History of Hardcore</title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="Joe Dawtry">
<meta name="Keywords" content="practice">
<meta name="Description" content="practice">
<link rel="stylesheet" type="text/css" href="index.css">
<style type="text/css">
* {
margin:0;
padding:0;
}
body {
font: 95% verdana, sans-serif;
line-height: 1.88889;
color: #555753;
background: #fff ;
text-align: center;
}
#container {
width:850px;
margin:0 auto;
text-align:left;
}
#pageheader {
background:url(header.jpg) no-repeat;
height:248px;
}
h2 {
float:left;
margin:160px 0 0 20px;
}
#navcontainer {
margin: 20px 0 0 30px;
padding: 0;
height: 20px;
position:relative;
float:left;
clear:left;
}
#navcontainer ul
{
border: 0;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}
#navcontainer ul li
{
display: block;
float: left;
text-align: center;
padding: 0;
margin: 0;
}
#navcontainer ul li a {
background: #fff;
width: 78px;
height: 18px;
border-top: 1px solid #00;
border-left: 1px solid #00;
border-bottom: 1px solid #00;
border-right: none;
padding: 0;
margin: 0 0 10px 0;
color: #0f0f0f;
text-decoration: none;
display: block;
text-align: center;
font: normal 10px/18px "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
}
#navcontainer ul li a:hover {
color: #fff;
background: #000000;
}
#navcontainer a:active {
background: #00;
color: #fff;
}
#navcontainer li#active a {
background: #0f0f0f;
border: 1px solid #0f0f0f;
color: #fff;
}
#content {
width:850px;
}
#quicksummary {
margin: 40px 0 20px 10px;
width: 160px;
float:left;
position:relative;
height:1%;
}
#quicksummary p {
font: italic 10pt/22pt georgia;
}
#howitbegan {
float:left;
width:660px;
margin:20px 0 0 20px;
}
</style>
</head>
<body>
<div id="container">
<div id="pageheader">
<h2>The History of Hardcore</h2>
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="index.html" id="current">Home</a></li>
<li><a href="item2.html">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</div>
<div id="content">
<div id="quicksummary">
<p class="p1"><span>Hardcore Punk is a subgenre of punk rock that originated in North America in the late 1970s. The new sound was generally thicker, heavier and faster than earlier punk rock. The songs are usually short, fast and loud, covering topics such as politics, personal freedom, violence, social alienation, Straight Edge, war, and the hardcore subculture itself.</span></p>
<p class="p2"><span>Hardcore spawned several fusion genres and subgenres, some of which had mainstream success, such as skate punk, melodic hardcore and metalcore.</span></p>
</div>
<div id="howitbegan">
<img src="thestart.jpg" >
<p class="p1"><span>In North America, the music genre that became known as hardcore punk originated in different areas in late 1970's and early 1981 in California, Washington, DC, Chicago, New York City, Winnipeg, Vancouver, Toronto and Boston. The origin of the term hardcore punk is not documented. The Vancouver-based band D.O.A. may have helped to popularize the term with the title of their 1981 album, Hardcore '81. However, until about 1983, the term hardcore was used fairly sparingly, and mainly as a descriptive term. (i.e., a band would be called a "hardcore band" and a concert would be a "hardcore show"). American teenagers who were fans of hardcore punk simply considered themselves fans of punk � although they were not necessarily interested in the original punk rock sound of late 1970s (e.g., Television, the Ramones, the Sex Pistols, The Clash, The Heartbreakers). In many circles, hardcore was an in-group term, meaning 'music by people like us,' and it included a wide range of sounds, from hyper-speed hardcore to sludgy dirge-rock, and sometimes including arty experimental bands, such as The Stickmen and Flipper.</span></p>
<p class="p2"><span>Since most bands had little access to any means of production, hardcore lauded a <acronym title="Do It Yourself">DIY</acronym> approach. In most cities the hardcore scene relied on inexpensively-made <acronym title="Do It Yourself">DIY</acronym> recordings done on four-track recorders and sold at shows or by mail. Concerts were promoted by photocopied zines, community radio shows, and affixing posters to walls and telephone poles. Hardcore punk fans adopted a a dressed-down style of T-shirts, jeans, and crewcut style. While 1977-era punk had used <acronym title="Do It Yourself">DIY</acronym> clothing as well, such as torn pants held together with safety pins, the "dressed down" style of 1980s hardcore scene contrasted with the more campy, elaborate and provocative fashion styles of late 1970s punk rockers such as Soo Catwoman, which featured make-up, elaborate hairdos and avant-garde clothing experiments.</span></p>
<p class="p3"><span>At the same time, there was a parallel development in the UK of a British form of hardcore punk, which later became known as UK 82. UK 82 bands such as Discharge and Charged GBH took the existing late 1970s punk sound and added the incessant, heavy drumbeats and "wall of sound" distortion guitar sound of New Wave of British Heavy Metal (NWOBHM) bands such as Mot�rhead. While North American hardcore punk and UK 82 hardcore developed at the same time, it is not clear whether UK 82 was directly influenced by the American hardcore punk scene, or vice versa.</span></p>
</div>
</div>
</div>
</body>
</html> |
|
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|
|
|
|