amandawhite.ajw Posted May 1, 2010 Report Share Posted May 1, 2010 I am new to dreamweaver and having some problems getting the site to look the way I want it. I have attached the image of how I want the site to look. The part that is holding me back is separating the text at the bottom of the site, the address/train directions. Can anyone help me out with how to do this? (I need to get this site up fast and then I am going to go back and learn about HTML/CSS, which I know should be learned first, but I do not have the time before I need to get this up.) Thanks for your help! Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted May 1, 2010 Report Share Posted May 1, 2010 Morning, You mean separating it vertically? If so, just give it a larger line-height. Quote Link to comment Share on other sites More sharing options...
falkencreative Posted May 1, 2010 Report Share Posted May 1, 2010 You mean separating it vertically? If so, just give it a larger line-height. I'm pretty sure she means horizontally -- positioning one block of text to the left and one to the right. @CByC002 - Usually that is done similarly to this: The basic code: <div class="left"> // your left text here </div> <div class="right"> // your right text here </div> And then you add some CSS to style it: .left { float:left; width: 100px; /* adjust your width to fit */ } .right { float:right; width: 100px; /* adjust your width to fit */ } If you post the code you are working with (either add the text within your post, or add it as an attachment) we'll be able to help a bit more. Quote Link to comment Share on other sites More sharing options...
amandawhite.ajw Posted May 1, 2010 Author Report Share Posted May 1, 2010 Below is the code that I have so far. I have attached a screen shot of what the design looks like in dreamweaver as well. I need to horizontally separate: 77 front street 2nd floor brooklyn ny 11201 and to clark street to high street to york street Also, in the original picture I included of the website plan, I have images representing the subway train numbers. How would I move those into the correct position as well? Thanks! <!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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Boxing For Fitness</title> <style type="text/css"> <!-- --> </style> <link href="../Documents/C BY C/Guy Vee/Website/Guy Vee 2.css" rel="stylesheet" type="text/css" /> <link href="CSS/Guy Vee.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="Content"><!-- #BeginLibraryItem "/Library/Nav.lbi" --> <p style="font-size:13pt; font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;"><a href="Index.html">HOME </a> <a href="About.html">ABOUT</a> <a href="Gallery.html">GALLERY</a> <a href="Pricing.html">PRICING</a> <a href="schedule.html">SCHEDULE </a> <a href="contact.html">CONTACT</a></p> <!-- #EndLibraryItem --><p> </p> <p><img src="../../Documents/C BY C/Guy Vee/Website/Logo.jpg" width="455" height="409" alt="Boxing For Fitness Logo" /></p> 77 FRONT STREET 2ND FLOOR BROOKLYN, NY 11201 TO CLARK STREET TO HIGH STREET TO YORK STREET </div> <p> </p> <p> </p> <p class="Footer"> </p> <p> </p> </body> </html> Quote Link to comment Share on other sites More sharing options...
amandawhite.ajw Posted May 1, 2010 Author Report Share Posted May 1, 2010 Updated code below: <!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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Boxing For Fitness</title> <style type="text/css"> <!-- --> </style> <link href="../Documents/C BY C/Guy Vee/Website/Guy Vee 2.css" rel="stylesheet" type="text/css" /> <link href="CSS/Guy Vee.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="Content"><!-- #BeginLibraryItem "/Library/Nav.lbi" --> <p style="font-size:13pt; font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;"><a href="Index.html">HOME </a> <a href="About.html">ABOUT</a> <a href="Gallery.html">GALLERY</a> <a href="Pricing.html">PRICING</a> <a href="schedule.html">SCHEDULE </a> <a href="contact.html">CONTACT</a></p> <!-- #EndLibraryItem --><p> </p> <p><img src="../../Documents/C BY C/Guy Vee/Website/Logo.jpg" width="455" height="409" alt="Boxing For Fitness Logo" /></p> <p> </p> <div class="left">77 FRONT STREET</div><div class="right">TO CLARK STREET</div> <div class="left">2ND FLOOR</div><div class="right">TO HIGH STREET</div> <div class="left">BROOKLYN, NY 11201</div><div class="right">TO YORK STREET</div> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
virtual Posted May 1, 2010 Report Share Posted May 1, 2010 <div class="left">77 FRONT STREET</div><div class="right">TO CLARK STREET</div><div class="left">2ND FLOOR</div><div class="right">TO HIGH STREET</div> <div class="left">BROOKLYN, NY 11201</div><div class="right">TO YORK STREET</div> That should be <div class="left"> <ul> <li>77 FRONT STREET</li> <li>2ND FLOOR</li> <li>BROOKLYN, NY 11201</li> </ul> </div> <div class="right"> <ul> <li>TO CLARK STREET</li> <li>TO HIGH STREET</li> <li>TO YORK STREET</li> </ul> </div> Then as Ben explained, style the .left and .right, you may need to style the ul li tags depending on what is in your css file. Quote Link to comment Share on other sites More sharing options...
amandawhite.ajw Posted May 1, 2010 Author Report Share Posted May 1, 2010 Thanks @falkencreative @virtual. On the right track now. Quote Link to comment Share on other sites More sharing options...
amandawhite.ajw Posted May 3, 2010 Author Report Share Posted May 3, 2010 Thanks again for your help. This is where I have gotten to since your replies. Guy Vee Boxing Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.