Layout like Daniweb Footer

[furqan219]

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

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;
}

[MJ Pieterse]

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%;
}

[furqan219]

Can I make like this

<div id=footer>
</div>

[furqan219]

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

[furqan219]

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

Its Working....

[furqan219]

How i can add buttons. footer working perfectly

[furqan219]

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

[MJ Pieterse]

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

[furqan219]

How I can add Buttons

[furqan219]

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

[MJ Pieterse]

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

[ayesha789]

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

[MJ Pieterse]

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;
}

[ayesha789]

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.

[master_99]

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

[master_99]

#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

[MJ Pieterse]

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;
}

[ayesha789]

But its not working properly

[ayesha789]

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

[ayesha789]

but I want style like Daniweb

> 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.

[MJ Pieterse]

besides that, be oringal and do your own thing. 'stealing' from another design is not what being a designer is about. you are the captain hook if you do. get inspiration from other people if you need it but plain copying is actually 'stealing' their work...

http://www.webdesignerdepot.com/2010/05/7-personality-types-of-designers-today/

[ayesha789]

Furqan want it not me

> Furqan want it not me

But...

> but I want style like Daniweb

Sounds like 'I' to me. Whatever.

[papanyquiL]

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.