PDA

View Full Version : Can I add a left side column??


thoughtsinfonts
03-19-2010, 06:22 PM
I'm working on my site in DW CS4 and wanted to know if I can add a left side column (to put a navigation bar) next to my contents region (that contains my product photos) on my products page but I don't want the column on my main home page, etc. Is this possible?

TIA

Corrosive
03-19-2010, 07:29 PM
I'm working on my site in DW CS4 and wanted to know if I can add a left side column (to put a navigation bar) next to my contents region (that contains my product photos) on my products page but I don't want the column on my main home page, etc. Is this possible?

TIA

Yes. Just can use styles placed between the head tags or a 'products' CSS file and then just add the HTML on the page you want.

thoughtsinfonts
03-21-2010, 10:26 PM
Would you mind being a little more "grade school" in your explanation? I'm learning and don't know all the codes yet. I basically have a big open "text block" that's editable. I've decided my layout and essentially want a navigation bar with links to other pages on the left side, then in the remaining space on the right, I want to place a few samples. Make sense? I will say that what coding I have learned, I like much better than working in design view. It does what I tell it to do!

Corrosive
03-22-2010, 07:49 AM
OK, grade school; http://corrosiveonline.co.uk/tutorials_css_floats_for_layout.php floats for layout :)

thoughtsinfonts
03-23-2010, 07:28 PM
Thanks for the tutorial! It helped me understand and I'm trying to apply it. Sometimes it works, sometimes not. Would someone look at my page and tell me what's wrong? I've worked on this for days and it really is the page I need to get done.

TIA
kelly

Sorry if I don't attach this right. :confused: This doesn't show that there are only two places that I can actually work in. Everything else is locked.



<!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"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Site Map - Thoughts in Fonts</title>
<!-- InstanceEndEditable -->
<link href="twoColFixLtHdr.css" rel="stylesheet" type="text/css" /><!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixLtHdr #sidebar1 { width: 230px; }
</style>
<![endif]--><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixLtHdr #sidebar1 { padding-top: 30px; }
.twoColFixLtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<style type="text/css">
<!--
body {
background-image: url(images/hcs_regalTeal_1920x1200.jpg);
background-color: #FFF;
background-repeat: no-repeat;
background-position: center top;
background-attachment: scroll;
}
-->
</style>
<style type="text/css">
<!--
body,td,th {
color: #300;
}
a:link {
text-decoration: none;
color: #300;
}
a:visited {
text-decoration: none;
color: #069;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
-->
</style>
<!-- InstanceBeginEditable name="head" -->
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<!-- InstanceEndEditable -->
</head>
<body class="twoColFixLtHdr">
<div id="container">
<div id="header"><a href="http://www.thoughtsinfonts.com"><img (http://www.thoughtsinfonts.com%22%3e%3cimg/) src="images/tif-web-header.gif" width="701" height="222" border="0" /></a>
<!--end #header--> <p><a href="home.html"><img src="images/menu-bullet-home.gif" width="125" height="49" border="0" /></a><a href="products.html"><img src="images/menu-bullet-products.gif" width="125" height="49" border="0" /></a><a href="ordering.html"><img src="images/menu-bullet-ordering.gif" width="125" height="49" border="0" /></a><a href="aboutus.html"><img src="images/menu-bullet-about-us.gif" width="125" height="49" border="0" /></a><a href="policies.html"><img src="images/menu-bullet-policies.gif" width="125" height="49" border="0" /></a><a href="contactus.html"><img src="images/menu-bullet-contact-us.gif" width="125" height="49" border="0" /></a></p>
</div>
<div id="sidebar1"></div>
<!-- InstanceBeginEditable name="Page Content" -->
<style type="text/css">
<!--

</style>
<script type="text/javascript">
<!--
<div id="main_content">
<div id="left_column">
<p>This is where my menu should be."</p>
</div>
<div id="right_column">
<p>This is where my images should be."</p>
</div>
</script>
<!-- InstanceEndEditable -->
<p align= "center">
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats -->
<span class="footerfontsize"><a href="customerscomments.html">Copyright &copy; <!-- InstanceBeginEditable name="footer date" --><span class="footerfontsize"><a href="customerscomments.html">2010</span><!-- InstanceEndEditable --> thoughtsinfonts.com</a><br class="clearfloat" /><br />
<a href="home.html">Home</a> * <a href="products.html">Products</a> * <a href="ordering.html">Ordering</a> * <a href="aboutus.html">About Us</a> * <a href="policies.html">Policies</a> * <a href="contactus.html">Contact Us</a></span></p>
<div id="footer">
<!-- end #footer -->
</div>
<!-- end #container --></div>
</body>
<!-- InstanceEnd --></html>

thoughtsinfonts
03-27-2010, 01:57 AM
I know everyone's busy but could someone please! help me! I'm about to just start the whole thing over and not delete the column on my main page just to get past this whole issue. I really, really, don't want to have to start over but if that's the best way, I will. I know this is an easy thing to do and I do understand about adding columns, it just isn't working. Please help!

TIA

kelly

edbr
03-27-2010, 02:03 AM
what is happening? you say sometimes works and sometimes not.