How to make Layout like Daniweb Footer
My Favourite Forums Todays Posts .............

Member Avatar for diafol

use css for keeping element at top or bottom of page

element{
  position:fixed;
  top:0;
  left: 0;
}
element{
  position:fixed;
  bottom:0;
  left: 0;
}

mmm... i think you should use this and then obviously add your stuff in the div you will create.

#footer {
    position:absolute;
    vertical-align:bottom;
    margin:0 auto;
    width:100%;
}

Can I make like this

<div id=footer>
</div>

No its not working ....
absolute or fixed?
is there ay example available

#footer {
    position:fixed;
    vertical-align:bottom;
    margin:0 auto;
    width:100%;
	background-color:#0066FF;
}

Its Working....

How i can add buttons. footer working perfectly

its working perfectly in Google Chrome but in internet explorer 6 its not working.

you'll need to create your buttons etc inside your footer div

How I can add Buttons

I am new to CSS. I want to add but guide me. also its not working in IE6.

it depends in what you are working. if asp then adding an imagebutton or linkbutton will be advised, alternatively you'll have to create a image tag and wrap it with a href tag so you can use it to redirect on click or you can use an form input button. There are many ways for this to happen and no one will be able to help you properly without you giving us the relevant information on what you are using to create your web page

I am using PHP and MYSQL.
I want to use CSS for creating Buttons.
I need 2 Buttons
FeedBack and Help

well, you'll have to use link buttons then, or text with a href tag around it and style if from there

example

.StandardButton {
	background-color:#CCCCCC;
	border:1px solid #CCCCCC;
	color:#666666;
	text-decoration:none;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	font-size:90%;
	text-transform:lowercase;
	font-weight:bold;
	background-image:url(../images/Button.png);
	background-repeat:repeat-x;
}

i make a link

<div id="footer" class="StandardButton"><a href="eims_north.php">Footer New</a></div>

and use CSS

#footer {
    position:fixed;
    vertical-align:bottom;

    margin:0 auto;
    width:100%;
	margin-left:0px;
}

.StandardButton {
	background-color:#73167A;
	border:1px solid #CCCCCC;
	color:#666666;
	text-decoration:none;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	font-size:90%;
	text-transform: uppercase;
	font-weight:bold;

But its not showing proper button.

#footer {
position:fixed;
vertical-align:bottom;
margin:0 auto;
width:100%;
background-color:#4C265D;
}

#footer_Daniweb Footer {
position:fixed;
vertical-align:bottom;
margin:0 auto;
width:100%;
background-color:#4C265D;
}

See below link to find out Professional Higher Page Rank CSS tutorials
http://www.tutorials99.com

because you are calling it wrong

<div id="footer"><a href="eims_north.php" class="StandardButton">Footer New</a></div>

your button class should be in the href tag. you cannot have two classes in the same div. you can then also add your hover styles etc to that button class.

css

#footer {    
	position:fixed;    
	vertical-align:bottom;     
	margin:0 auto;  
	width:100%;	
	margin-left:0px;
} 
.StandardButton {	
	background-color:#73167A;	
	border:1px solid #CCCCCC;	
	color:#666666;	
	text-decoration:none;	
	padding-top:5px;	
	padding-left:10px;	
	padding-right:10px;	
	font-size:90%;	
	text-transform: uppercase;	
	font-weight:bold;
}
.StandardButton a {	
	background-color:#73167A;	
	border:1px solid #CCCCCC;	
	color:#666666;	
	text-decoration:none;	
	padding-top:5px;	
	padding-left:10px;	
	padding-right:10px;	
	font-size:90%;	
	text-decoration:none;
	font-weight:bold;
}
.StandardButton a:link {	
	background-color:#73167A;	
	border:1px solid #CCCCCC;	
	color:#666666;	
	text-decoration:none;	
	padding-top:5px;	
	padding-left:10px;	
	padding-right:10px;	
	font-size:90%;	
	text-decoration:none;	
	font-weight:bold;
}
.StandardButton a:hover {	
	background-color:#73167A;	
	border:1px solid #000000;	
	color:#666666;	
	text-decoration:none;	
	padding-top:5px;	
	padding-left:10px;	
	padding-right:10px;	
	font-size:90%;	
	text-decoration:none;	
	font-weight:bold;
}

But its not working properly

Now its working..... on button click but not when page refresh

but I want style like Daniweb

Member Avatar for diafol

> but I want style like Daniweb

You want it, you code it. The global recession has dictated that free lunches are now deemed bad for your health. No pain, no gain.

Furqan want it not me

Member Avatar for diafol

> Furqan want it not me

But...

> but I want style like Daniweb

Sounds like 'I' to me. Whatever.

Stop asking other people to make the code for you. What you're trying to accomplish is very basic and can be learned through the CSS tutorial sites that multiple people have posted in just a few hours. There are also multiple solutions to your problem on Google.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.