Footer div loaction

Dev Shed Forums Sponsor:

February 28th, 2013, 03:04 PM

hala gamal

Registered User

Join Date: Feb 2013

Posts: 1

Time spent in forums: 1 h 9 m 12 sec
Reputation Power: 0

New Member - Footer div loaction

i have div for footer which contain images of (facebook,twitter,youtube) in the middle but when i make zoom in or out the images go right or left ,, i want to keep them in the same position how to do that?

February 28th, 2013, 04:20 PM

Nanomech

Contributing User

Join Date: Aug 2011

Location: The Pleiades

Posts: 196

Time spent in forums: 1 Day 23 h 52 m 41 sec
Reputation Power: 7

This sounds like a floating issue. Put the images within another div and center that div.

Try this:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>HTML Template</title>
   
<style type="text/css">
#footer
{
	width: 90%;
	background: red;
	margin: auto;
	height: 150px;
}

#icons
{
	width: 200px;
	margin: auto;
	text-align: center;
	background: blue;
}

img
{
	width: 30px;
	height: 30px;
}

</style>
</head>

<body>

<div id="footer">
	<div id="icons">
		<img src="img1.jpg" alt="facebook" />
		<img src="img2.jpg" alt="youtube" />
		<img src="img3.jpg" alt="twitter" />
	</div>
</div>

</body>
</html>

Put this in a text file and run it.

Check out the attachment.

Delete the floats and add text-align: center; to your icon div.

Kind regards,

Nm.

Attached Images

sst.png (222.1 KB, 5 views)

__________________
"WERE NOT WORTHY!"

"WERE NOT WORTHY!"

Viewing: Dev Shed Forums > Web Design > CSS Help > New Member - Footer div loaction

« Previous Thread | Next Thread »

Developer Shed Advertisers and Affiliates

Thread Tools	Search this Thread
Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Posting Rules
You may not post new threads You may not post replies You may not post attachments You may not edit your posts vB code is On Smilies are On [IMG] code is On HTML code is Off

View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox

Forum Jump