| View previous topic :: View next topic |
| Author |
Message |
AngalotH
Joined: 23 Jul 2004
Posts: 70
|
 Posted: 12.10.2005 16:55 Post subject: pozicioniranje footera s CSS-om |
  |
|
| Kako dobit da mi se footer postavlja na dno prozora ako je visina sadrzaja manja od visine prozora i da mi se istovremeno postavlja na dno stranice u slucaju da je visina sadrzaja veća od visine prozora. Hvala unaprijed. |
|
|
| Back to top |
|
 |
Eric
Joined: 27 Jun 2005
Posts: 248
Location: Rijeka on rails
|
|
| Back to top |
|
|
gog
Joined: 18 Jun 2004
Posts: 679
Location: zagreb
|
|
| Back to top |
|
|
red
Joined: 03 May 2004
Posts: 919
Location: Zabok
|
|
| Back to top |
|
|
štrumfhoza
Joined: 24 Feb 2005
Posts: 89
|
| Posted: 12.10.2005 22:15 Post subject: |
|
|
HTML
[url]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Three-Column Layout Demonstration</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1" />
<link href="3col-float.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="top">
<h1>
This is the header area of the three column plus header
layout
</h1>
</div>
<div id="wrapper">
<div id="left">
<p>
This left column must appear first in the HTML code. Using CSS, it is floated
to the left side of the "wrapper" block that encloses all three columns.</p>
<p>If you assign a background color or image to this column, you will also
need to style the "wrapper" block so that the background is matched when
this isn't the longest column on the page. </p>
</div>
<div id="right">
<p>
This right column actually comes second in the code. This is necessary
for it to line up with the top of the other two columns when floated. </p>
</div>
<div id="center">
<p>
This center column actually appears last in the HTML code. This is a necessary
evil of this particular method. Only the
absolute positioning method discussed previously allows this column to
come first.</p>
<p>To leave room for the side columns, this center column
has left and right margins equal to their respective widths (plus additional
spacing).</p>
</div>
<div id="clear"></div>
</div>
<div id="footer">
<p>
This footer should float below the three columns.
</p>
</div>
</body>
</html>[/url]
CSS
[url]body {
margin: 0;
padding: 0;
}
#top {
margin: 20px;
padding: 10px;
background: #ccc;
height: 100px;
}
#wrapper {
margin: 0 10px;
padding: 0;
}
#left {
float: left;
width: 200px;
}
#right {
float: right;
width: 200px;
}
#center {
margin-left: 210px;
margin-right: 210px;
background-color: #ccc;
}
#clear {
clear: both;
}
#footer {
background: #ccc;
margin: 20px;
text-align: center;
}
/* Removes default top margin from left/right column paragraphs in Mozilla */
div > p {
margin-top: 0;
}
[/url]
poglej ovo možda pomogne |
|
|
| Back to top |
|
|
|
Forum FAQ
Search
Memberlist
Forum ignore list
Register
Profile
Log in to check your private messages
Log in
