Jump to content

Trying to separate text.


amandawhite.ajw

Recommended Posts

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!

post-28814-127272106256_thumb.jpg

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

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>

post-28814-127273522308_thumb.png

Link to comment
Share on other sites

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>

Link to comment
Share on other sites

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

Link to comment
Share on other sites

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.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...