here is my code:
<div class="footer">
<div align="center" class="address">
<div align="center" style="text-align: left; float: left; padding: 8px;">
3445 Winton Place<br />
Suite 219<br />
Rochester, New York 14623<br />
Phone: (585) 292-1590<br />
Fax: (585) 292-1592<br />
</div>
<div align="center" style="text-align: left; float: left; padding: 8px;">
49 Stradtman Street<br />
Suite F<br />
Cheektowaga, New York 14206<br />
Phone: (716) 892-1310<br />
Fax: (716) 892-2540<br />
</div>
<div align="center" style="text-align: left; float: left; padding: 8px;">
423 New Karner Road<br />
2nd Floor, Suite 10<br />
Albany, New York 12205<br />
Phone: (518) 456-0792<br />
Fax: (518) 456-0798<br />
</div>
</div>
<div style="position: relative; text-align: center;">
<br /><br /><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Home</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Site Map</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Contact Us</a> |
©1997-2005 IBC Egineering
</div>
</div>
basically what i want is for each address to be aligned left in its div (already done) and for all the address div's collectively to be aligned to the middle of the page. i also want the last div w/ the links in it to be below the address, and aligned to the center. I tried making a container div and aligning it center but didnt have much luck. you can see what this code renders like at <!-- w --><a class="postlink" href="http://www.alabu.com/ibc/index.html">www.alabu.com/ibc/index.html</a><!-- w --> just scroll to the footer. Everything is how i want it to be except the addresses (collectively) need to be aligned center, and the links need to go below the addresses. Sorry if i didnt explain it well. anyone have some ideas? thanks
~HalCan you post a screen shot or graphic of how you want it to look? I'm not entirely sure how to go about this. If you want a box in the middle of two columns and have text flow around all four sides of the box, it's pretty much impossible in Web design, though A List Apart showed a controversial possibility:
<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/crosscolumn/">http://www.alistapart.com/articles/crosscolumn/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/crosscolumn2/Try">http://www.alistapart.com/articles/crosscolumn2/Try</a><!-- m --> this, perhaps. (You'll probably want to play around with the width for the address div to get it just right.)
<div class="footer">
<div style="width: 38em; margin-left: auto; margin-right: auto;" class="address">
<div style="text-align: left; float: left; padding: 8px;">
3445 Winton Place<br />
Suite 219<br />
Rochester, New York 14623<br />
Phone: (585) 292-1590<br />
Fax: (585) 292-1592<br />
</div>
<div style="text-align: left; float: left; padding: 8px;">
49 Stradtman Street<br />
Suite F<br />
Cheektowaga, New York 14206<br />
Phone: (716) 892-1310<br />
Fax: (716) 892-2540<br />
</div>
<div style="text-align: left; float: left; padding: 8px;">
423 New Karner Road<br />
2nd Floor, Suite 10<br />
Albany, New York 12205<br />
Phone: (518) 456-0792<br />
Fax: (518) 456-0798<br />
</div>
</div>
<div style="clear: both; text-align: center;">
<br /> <br /> <br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Home</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Site Map</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Contact Us</a> |
©1997-2005 IBC Egineering
</div>
</div>thanks, that worked great... just curious, what exactly did that do? i realize it set the width of the div, but how does that make it center properly? also what are "em?" I've never used that as a unit before. thanks
~HalOriginally posted by lahmayes
thanks, that worked great... just curious, what exactly did that do? i realize it set the width of the div, but how does that make it center properly? also what are "em?" I've never used that as a unit before. thanks
~Hal
A combination of a fixed-width box with left- and right-margin set to "auto" results in a centered box.
"em" is a unit of measure which is relative to the font size. I used that here so that if the font size is increased/decreased or otherwise changed, the box should hopefully resize to adjust.cool... thanks!
<div class="footer">
<div align="center" class="address">
<div align="center" style="text-align: left; float: left; padding: 8px;">
3445 Winton Place<br />
Suite 219<br />
Rochester, New York 14623<br />
Phone: (585) 292-1590<br />
Fax: (585) 292-1592<br />
</div>
<div align="center" style="text-align: left; float: left; padding: 8px;">
49 Stradtman Street<br />
Suite F<br />
Cheektowaga, New York 14206<br />
Phone: (716) 892-1310<br />
Fax: (716) 892-2540<br />
</div>
<div align="center" style="text-align: left; float: left; padding: 8px;">
423 New Karner Road<br />
2nd Floor, Suite 10<br />
Albany, New York 12205<br />
Phone: (518) 456-0792<br />
Fax: (518) 456-0798<br />
</div>
</div>
<div style="position: relative; text-align: center;">
<br /><br /><br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Home</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Site Map</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Contact Us</a> |
©1997-2005 IBC Egineering
</div>
</div>
basically what i want is for each address to be aligned left in its div (already done) and for all the address div's collectively to be aligned to the middle of the page. i also want the last div w/ the links in it to be below the address, and aligned to the center. I tried making a container div and aligning it center but didnt have much luck. you can see what this code renders like at <!-- w --><a class="postlink" href="http://www.alabu.com/ibc/index.html">www.alabu.com/ibc/index.html</a><!-- w --> just scroll to the footer. Everything is how i want it to be except the addresses (collectively) need to be aligned center, and the links need to go below the addresses. Sorry if i didnt explain it well. anyone have some ideas? thanks
~HalCan you post a screen shot or graphic of how you want it to look? I'm not entirely sure how to go about this. If you want a box in the middle of two columns and have text flow around all four sides of the box, it's pretty much impossible in Web design, though A List Apart showed a controversial possibility:
<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/crosscolumn/">http://www.alistapart.com/articles/crosscolumn/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/crosscolumn2/Try">http://www.alistapart.com/articles/crosscolumn2/Try</a><!-- m --> this, perhaps. (You'll probably want to play around with the width for the address div to get it just right.)
<div class="footer">
<div style="width: 38em; margin-left: auto; margin-right: auto;" class="address">
<div style="text-align: left; float: left; padding: 8px;">
3445 Winton Place<br />
Suite 219<br />
Rochester, New York 14623<br />
Phone: (585) 292-1590<br />
Fax: (585) 292-1592<br />
</div>
<div style="text-align: left; float: left; padding: 8px;">
49 Stradtman Street<br />
Suite F<br />
Cheektowaga, New York 14206<br />
Phone: (716) 892-1310<br />
Fax: (716) 892-2540<br />
</div>
<div style="text-align: left; float: left; padding: 8px;">
423 New Karner Road<br />
2nd Floor, Suite 10<br />
Albany, New York 12205<br />
Phone: (518) 456-0792<br />
Fax: (518) 456-0798<br />
</div>
</div>
<div style="clear: both; text-align: center;">
<br /> <br /> <br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Home</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Site Map</a> |
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Contact Us</a> |
©1997-2005 IBC Egineering
</div>
</div>thanks, that worked great... just curious, what exactly did that do? i realize it set the width of the div, but how does that make it center properly? also what are "em?" I've never used that as a unit before. thanks
~HalOriginally posted by lahmayes
thanks, that worked great... just curious, what exactly did that do? i realize it set the width of the div, but how does that make it center properly? also what are "em?" I've never used that as a unit before. thanks
~Hal
A combination of a fixed-width box with left- and right-margin set to "auto" results in a centered box.
"em" is a unit of measure which is relative to the font size. I used that here so that if the font size is increased/decreased or otherwise changed, the box should hopefully resize to adjust.cool... thanks!