Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Jun 2005
    Location
    Spain
    Posts
    105
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Unobedient navigation does not want to align to the left..

    Here's the site www.sofielyr.com please see in firefox.. click on "rides" to the left and see the CSS..

    I've rebuildt this site thank's to VIPstephan, taking away the tables using only div.

    Lot's of problems still of cause, but to begin with, why doesn't my navigation line up to the left when I've told it to?! Or actually it does if I don't align all the content to the centre... How can I align all of the page to the centre but still keep the nav to the left?

    Later I would like the left pink box to follow automatically all the way down to the footer. So that the text to the right doesn't come in under it. How please?

    I also want to have my text padded about 3-5 px round the picture and from the borders without making the whole box bigger... Healp Healp Please

    Further I want the page to look the same in IE as in Firefox...
    Last edited by Sofie; 11-03-2006 at 03:43 PM.

  • #2
    Regular Coder
    Join Date
    Dec 2005
    Location
    Ohio
    Posts
    286
    Thanks
    7
    Thanked 9 Times in 9 Posts
    Quote Originally Posted by Sofie View Post
    Lot's of problems still of cause, but to begin with, why doesn't my navigation line up to the left when I've told it to?! Or actually it does if I don't align all the content to the centre... How can I align all of the page to the centre but still keep the nav to the left?
    Your issue here is that you are using deprecated code and it is doing exactly what you are telling it to do. align="center", aside from being deprecated will align everything within that tag to the center.


    Quote Originally Posted by Sofie View Post
    Later I would like the left pink box to follow automatically all the way down to the footer. So that the text to the right doesn't come in under it. How please?
    Consider this option to accomplish this.

    Quote Originally Posted by Sofie View Post
    I also want to have my text padded about 3-5 px round the picture and from the borders without making the whole box bigger... Healp Healp Please
    Further I want the page to look the same in IE as in Firefox...
    Do remember that IE (well, IE6 at least) tends to double paddings and margins; meaning padding: 3px; will appear as padding: 6px; in IE. You would need to specifically target IE although from what I have learned, star-hacks are no longer viable in IE7.

    I have corrected your primary issue of centering the page with left-aligned navigation. You should look more at using CSS shorthand for redundant properties and values. Also, validate your code before you begin troubleshooting. It could solve a lot of problems right from the start.


    CSS:
    Code:
    #masterdiv {
    	margin: auto;
    	width: 780px;
    	position:relative;
    	}
    	
    .navigation {
    	font-family: Arial, Helvetica, sans-serif;
    	width: 769px;
    	text-align: left;
    	font-size: 12px;
    	color: #513027;
    	text-decoration: none;
    	display: inline;
    	border-width: medium
    	border-style: none none none groove;
    	border-color: #D7926B;
    	margin: auto;
    }
    .navigation a {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 769px;
    	padding-right: 3px;
    	padding-left: 3px;
    	font-weight: bold;
    }
    .foten {
    	font-family: Arial, Helvetica, sans-serif;
    	color: #4A2F28;
    	font-size: 10px;
    	width: 772px;
    	border-width: medium;
    	border-style: groove none groove groove;
    	border-color: #D7926B;	
    	text-align: center;
    	clear: both;
    }
    
    a:hover {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4E8645;
    	text-decoration: none;
    	font-weight: bold;
    }
    
    .mainframe {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	width: 775px;
    	border-right-style: groove;
    	border-left-style: groove;
    	display: block;
    	text-align: left;
    	margin: 0px;
    	border-color: #D7926B;	
    	color: #59453A;
    	white-space: normal;
    	position: static;
    	padding: 0px;
    	float: left;
    	border-width: medium;
    	border-top-style: groove;
    }
    
    .mainframe strong {
    	font-size: 20px;
    	font-weight: 600;
    	color: #4A2F28;
    	font-variant: normal;
    	text-transform: none;
    	display: inline;
    	left: 0px;
    	top: 0px;
    	right: 0px;
    	bottom: 0px;
    	white-space: normal;
    	vertical-align: text-top;
    	padding: 6px;
    	clear: none;
    	page-break-before: left;
    	page-break-after: left;
    }
    .mainframe img {
    	border-top-width: medium;
    	border-right-width: medium;
    	border-bottom-width: medium;
    	border-left-width: medium;
    	border-top-style: none;
    	border-right-style: groove;
    	border-bottom-style: groove;
    	border-left-style: groove;
    	border-top-color: #D7926B;
    	border-right-color: #D7926B;
    	border-bottom-color: #D7926B;
    	border-left-color: #D7926B;
    	padding: 0px;
    	float: left;
    	page-break-before: always;
    }
    
    
    
    .leftnav {
    	font-family: Arial, Helvetica, sans-serif;
    	font-weight: bold;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 150px;
    	height: auto;
    	float: left;
    	border-right-style: none;
    	background-color: #D7926B;
    	border-color: #D7926B;
    	border-width: thin;
    	
    }
    
    .bannern {
    	width: 769px;
    	border: medium groove #D7926B;
    }
    .linksinwritten {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;
    	color: #513027;
    	text-decoration: none;
    }
    
    ul {
    	padding: 0;
    	margin: -1px 0 0 0;
    	}
    
    li {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;
    	color: #330033;
    	display: inline;
    	padding: 0px;
    }
    
    #middle {
    	float: left;
    	width: 620px;
    	}
    
    #rightinfo {
    	float: left;
    	width: 299px;
    	}
    
    #pic {
    	float: left;
    	width: 318px;
    	}
    HTML:
    Code:
    <body>
    <div id="masterdiv">
    <div class="bannern"><img src="banner kopiera.jpg" alt="this is the banner" />
    </div>
    <div class="navigation">
    	<ul>
    		<li style="border-left: medium groove #D7926B;">
    		<script type="text/javascript">
    		
    		/*Current date script credit: 
    		JavaScript Kit (www.javascriptkit.com)
    		Over 200+ free scripts here!
    		*/
    		
    		var mydate=new Date()
    		var year=mydate.getYear()
    		if (year < 1000)
    		year+=1900
    		var day=mydate.getDay()
    		var month=mydate.getMonth()
    		var daym=mydate.getDate()
    		if (daym<10)
    		daym="0"+daym
    		var dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
    		var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December")
    		document.write("<small><font color='733D25' face='Arial'><b>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+"</b></font></small>")
    		
    		</script></li>
    		<li class="navigation"><a href="#">home</a></li>
    		<li class="navigation"><a href="#">about us</a></li>
    		
    		<li class="navigation"><a href="#">the yard</a></li>
    		<li class="navigation"><a href="#">the horses</a></li>
    		<li class="navigation"><a href="#">livery</a></li>
    		<li class="navigation"><a href="#">hacking</a></li>
    		<li class="navigation"><a href="#">lessons</a></li>
    		<li class="navigation"><a href="#">prices</a></li>
    		
    		<li class="navigation"><a href="#">contact</a></li>
    		<li class="navigation"><a href="#">map</a></li>
    		<li class="navigation"><a href="#">links</a></li>
    	</ul>
    			</div>
    <div>
    <div class="mainframe">
      <div class="leftnav">    
        In this box you can put things that are coming up like 
    	<ul>
    	<li class="linksinwritten"> <a href="index.css" class="linksinwritten">rides</a> </li> 
    	</ul>
        I'm just writing here to fill space la la la la la.... 
    	<br />
       
        <p>&nbsp; </p>
      </div>
      <div id="middle">
    	  <div id="pic">
    	  <img src="cowhorsemen.jpg" alt="this is a picture of some cowboys" width="316" height="223" />  
    	  </div>
    	  <div id="rightinfo">  
    		  <p><strong>Ride along goat tracks, through rivers and on mountain ridges in Sierra de las Nieves national park.</strong></p>
    		  <p>Enjoy  stunning scenery, fantastic food, wonderful horses, and friendly staff.  Join us for a great ride in Southern Spain. We are in  the white village of Monda, yet only 30 minutes drive from Jet Set  Marbella, Puerto Banus and the beach. We cater for all levels and you  can ride for as little as one hour to a full day. You could also join  us for the adventure of your life on an overnight ride or full weeks riding holiday.</p>
    		  <p>Other  activities available nearby for non-riders, such as archery, quad  biking, shooting, jeep safari, walking, swimming, art classes, golf and  tennis.</p>
    	  </div>
      </div>
    
    
    <div class="foten">Monda riding stables Sue Platt tel: 952 1245877 </div>
    </div>
    </body>
    The above will validate once you set the javascript as an external file. In place of the javascript, you would use:

    Code:
    <script src="date.js" type="text/javascript"></script>
    I attached the date.js file to this post.

    Hope this helps.
    PS: It is disobedient, not un-
    Attached Files Attached Files
    Last edited by kaitco; 11-03-2006 at 05:13 PM.

  • #3
    Regular Coder
    Join Date
    Jun 2005
    Location
    Spain
    Posts
    105
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Hi kaitco,

    Thanks a lot for all this! Will go through it asap - just wanted to say thank's right away.

    And jepp, I thought about "dis" right after I sent it... Couldn't change it though. I am not a native english speaker - I am from "hurdy-gurdy land" ie Sweden..

    /Sof

  • #4
    Regular Coder
    Join Date
    Jun 2005
    Location
    Spain
    Posts
    105
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Hi,

    I have now updated my code with your changes. There are some more questions though. I noticed that you had put quite a few new rules in my CSS. To begin with why does your rules have a # in front of them? (may be a silly question ) Also I noticed that you had made the box with my text bigger so it didn't match the banner. When I tried to correct this it all went a bit wrong ...

    First there is a big gap between the banner and the navigation, then the textbox text goes into the picture..

    I have not fully understood the changes you have made, which makes it a bit hard to fix them. I have noticed a lot of small tag changes in my html too. like the use of <p> in stead of <div> I also want to know what this does..
    Code:
    <body>
    <div id="masterdiv">
    <div class="bannern"><img src="banner kopiera.jpg" alt="this is the banner" />
    </div>
    It namely sais "invalid markup because of unclosed tag" on the "masterdiv" -bit in my properties box. Hope you can take some time to help some more..
    Thanks /Sof

  • #5
    Regular Coder
    Join Date
    Jun 2005
    Location
    Spain
    Posts
    105
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Have managed to fix some of the things myself now..

    But I still don't want that big space between the navigation and the banner. It goes away if I take away the <ul> but then I get a fault in my validation. And I still want it to look the same in IE.. Someone??

  • #6
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Code:
    ul {
    margin:0;
    padding:0;
    }
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #7
    Regular Coder
    Join Date
    Jun 2005
    Location
    Spain
    Posts
    105
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Hi,

    I already have that in my CSS - don't know how to put it in with my html... DO I have to make some sort of special <div> for that?

  • #8
    Regular Coder
    Join Date
    Dec 2005
    Location
    Ohio
    Posts
    286
    Thanks
    7
    Thanked 9 Times in 9 Posts
    The CSS for your navigation, and your navigation re-written:
    Code:
    .navigation {
    	font-family: Arial, Helvetica, sans-serif;
    	width: 769px;
    	text-align: left;
    	font-size: 12px;
    	color: #513027;
    	text-decoration: none;
    	display: inline;
    	border-width: medium
    	border-style: none none none groove;
    	margin: auto;
    	border: medium none #D7926B;
    }
    
    .navigation a {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 769px;
    	padding-right: 3px;
    	padding-left: 3px;
    	font-weight: bold;
    	border: none;
    }
    
    .navigation ul {
    	padding: 0;
    	margin: 0;	
    	}
    
    .navigation li {
    	border-right: medium groove #D7926B;
    	display: inline;
    	}
    The HTML:
    Code:
    <div class="navigation">
    	<ul>
    		<li><script src="datum.js" type="text/javascript"></script></li>	
    		<li><a href="#">home</a></li>
    		<li><a href="#">about us</a></li>
    		<li><a href="#">the yard</a></li>
    		<li><a href="#">the horses</a></li>
    		<li><a href="#">livery</a></li>
    		<li><a href="#">hacking</a></li>
    		<li><a href="#">lessons</a></li>
    		<li><a href="#">prices</a></li>
    		<li><a href="#">contact</a></li>
    		<li><a href="#">map</a></li>
    		<li><a href="#">links</a></li>
    	</ul>
    </div>
    Like Aerospace said above, adding padding: 0; and margin: 0; will fix your problem.

    I went through your code again and added comments everywhere I made changes. I bolded some of the more important ones. Read the comments and then see if the changes I made make sense to you.

    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>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Sierra de las Nieves riding adventures</title>
    <link href="navigation.css" rel="stylesheet" type="text/css" />
    
    <style>
    #masterdiv {
    	margin: auto;
    	width: 780px;
    	position:relative;
    	}
    	
    .navigation {
    	font-family: Arial, Helvetica, sans-serif;
    	width: 769px;
    	text-align: left;
    	font-size: 12px;
    	color: #513027;
    	text-decoration: none;
    	display: inline;
    	border-width: medium
    	border-style: none none none groove; /* This is CSS shorthand. It describes the border style according to top, right, bottom and left; in that order. Look at W3Schools for more information.*/
    	margin: auto;
    	border: medium none #D7926B;
    }
    .navigation a {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 769px;
    	padding-right: 3px;
    	padding-left: 3px;
    	font-weight: bold;
    	/*All this can be simplified as shown below this comment.
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;*/
    	border: none;
    }
    
    .navigation {
    	font-family: Arial, Helvetica, sans-serif;
    	width: 769px;
    	text-align: left;
    	font-size: 12px;
    	color: #513027;
    	text-decoration: none;
    	display: inline;
    	border-width: medium
    	border-style: none none none groove;
    	margin: auto;
    	border: medium none #D7926B;
    }
    
    .navigation a {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 769px;
    	padding-right: 3px;
    	padding-left: 3px;
    	font-weight: bold;
    	border: none;
    }
    
    .navigation ul {
    	padding: 0;
    	margin: 0;	
    	}
    
    .navigation li {
    	border-right: medium groove #D7926B;
    	display: inline;
    	}
    
    ul {
    	margin:0;
    	/* Use shorthand
    	padding-top: 0;
    	padding-right: 0;
    	padding-bottom: 0;
    	padding-left: 0; */
    	padding: 0;
    	vertical-align: top;
    	display: inline;
    	}
    
    li {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;
    	color: #4A2F28;
    	display: inline;
    	padding: 0;
    	text-decoration: none;
    	margin: 0;
    }
    
    .foten {
    	font-family: Arial, Helvetica, sans-serif;
    	color: #4A2F28;
    	font-size: 10px;
    	width: 769px;
    	text-align: center;
    	clear: both;
    	/* This is a perfect example of how to use CSS shorthand instead of 11 lines of CSS, you can just use 4.
    	border-top-width: medium;
    	border-right-width: medium;
    	border-bottom-width: medium;
    	border-left-width: medium;
    	border-top-style: groove;
    	border-right-style: none;
    	border-bottom-style: groove;
    	border-left-style: none;
    	border-top-color: #D7926B;
    	border-right-color: #D7926B;
    	border-bottom-color: #D7926B;
    	border-left-color: #D7926B;*/
    	border-top: medium groove #D7926B;
    	border-right: medium none #D7926B;
    	border-bottom: medium groove #D7926B;
    	border-left: medium groove #D7926B;
    }
    
    a:hover {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #4E8645;
    	text-decoration: none;
    	font-weight: bold;
    }
    
    .mainframe {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	width: 769px;
    	/* Use shorthand
    	border-right-style: groove;
    	border-left-style: groove;
    	border-top-style: groove; */
    	border-style: groove groove none groove;
    	display: marker;
    	text-align: left;
    	margin: 0px;
    	border-color: #D7926B;	
    	color: #59453A;
    	white-space: normal;
    	position: static;
    	padding: 0px;
    	float: left;
    	border-width: medium;
    	
    }
    
    .mainframe strong {
    	font-size: 18px;
    	font-weight: lighter;
    	color: #4A2F28;
    	text-transform: none;
    	display: inline;
    	left: 0px;
    	top: 0px;
    	right: 0px;
    	bottom: 0px;
    	white-space: normal;
    	padding: 6px;
    	clear: none;
    	page-break-before: auto;
    	page-break-after: auto;
    	text-align: left;
    	font-family: Arial, Helvetica, sans-serif;
    	position: static;
    }
    .mainframe img {
    	float: left;
    	page-break-before: always;
    	border: medium none #D7926B;
    	/* Use shorthand
    	padding-top: 0px;
    	padding-right: 0px;
    	padding-bottom: 0px;
    	padding-left: 0px; */
    	padding: 0;
    }
    
    .leftnav {
    	font-family: Arial, Helvetica, sans-serif;
    	font-weight: bold;
    	color: #4A2F28;
    	text-decoration: none;
    	width: 140px;
    	height: auto;
    	float: left;
    	border-right-style: groove;
    	background-color: #D7926B;
    	/* Use shorthand. Since border-right has a "groove," you will need to describe the border properties for the top, right, bottom and middle. Otherwise, this could have been inside just one line: border: thin none #D7926B;
    	border-right-width: thin;
    	border-bottom-width: thin;
    	border-left-width: thin;
    	border-top-color: #D7926B;
    	border-right-color: #D7926B;
    	border-bottom-color: #D7926B;
    	border-left-color: #D7926B;*/	
    	border-top: thin none #D7926B;
    	border-right: thin groove #D7926B;
    	border-bottom: thin none #D7926B;
    	border-left: thin none #D7926B;	
    }
    
    .bannern {
    	width: 769px;
    	border: medium groove #D7926B;
    }
    
    .linksinwritten {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;
    	color: #513027;
    	text-decoration: none;
    }
    
    #middle {
    	float: left;
    	}
    
    #rightinfo {
    	float: left;
    	width: 292px;
    	/* Use shorthand
    	padding-top: 0px;
    	padding-right: 10px;
    	padding-bottom: 0px;
    	padding-left: 10px;*/
    	padding: 0 10px 0 0;
    	}
    
    #pic {
    	float: left;
    	padding: 0px;
    	list-style-image: url(bullet%20kopiera.jpg);
    	}
    	
    #leftinfo {
    	float: left;
    	width: 130px;
    	font-family: Arial, Helvetica, sans-serif;
    	padding: 3px;
    	background-color: #D7926B;
    	/*Use shorthand
    	border-top-width: medium;
    	border-right-width: medium;
    	border-bottom-width: medium;
    	border-left-width: medium;
    	border-right-style: groove;
    	border-top-color: #D7926B;
    	border-right-color: #D7926B;
    	border-bottom-color: #D7926B;
    	border-left-color: #D7926B;*/
    	border-top: thin none #D7926B;
    	border-right: thin groove #D7926B;
    	border-bottom: thin none #D7926B;
    	border-left: thin none #D7926B;	
    	}
    
    </style>
    </head>
    <body>
    <div id="masterdiv"><div class="bannern"><img src="banner kopiera.jpg" alt="this is the banner" />
    </div>
    
    <!-- I have replaced this list below this comment. CSS is about cascading your styles. Look at the corresponding CSS for this <div>. Rather than include an inline style for each list item, style this specific list using your stylesheet. It will save far more code and keep you from having to go back and change several items if you need to make one change. For example, you have 10+ items in this list. If you decided to change your colors, you would have to change the colors on every single list item.
    <div class="navigation"><ul id="ul"> <--Unless you have an id you are calling "ul" (which is not advisable) this is not necessary.
    <li style="border-left: medium groove #D7926B; border-right: medium groove #D7926B;">
    
    
    
    		<script src="datum.js" type="text/javascript"></script></li>	
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">home</a></li>
    
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">about us</a></li>
    		
    		
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">the yard</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">the horses</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">livery</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">hacking</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">lessons</a></li>
    
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">prices</a></li>
    		
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">contact</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">map</a></li>
    		<li class="navigation" style="border-right: medium groove #D7926B;"><a href="#">links</a></li>
    	</ul>
    </div>
    -->
    
    <div class="navigation">
    	<ul>
    		<li><script src="datum.js" type="text/javascript"></script></li>	
    		<li><a href="#">home</a></li>
    		<li><a href="#">about us</a></li>
    		<li><a href="#">the yard</a></li>
    		<li><a href="#">the horses</a></li>
    		<li><a href="#">livery</a></li>
    		<li><a href="#">hacking</a></li>
    		<li><a href="#">lessons</a></li>
    		<li><a href="#">prices</a></li>
    		<li><a href="#">contact</a></li>
    		<li><a href="#">map</a></li>
    		<li><a href="#">links</a></li>
    	</ul>
    </div>
    
    
    <div class="mainframe">
      <div id="leftinfo">    
      
        In this box you can put things that are coming up like 
    	<!-- You have added an unordered list here, and I assume you will eventually have a list of links here. If you are not, why not just include this link as just a hyperlink: ...coming up like <a href="navigation.css" class="linksinwritten">rides</a> -->
    	<ul>
    
    	<li class="linksinwritten"> <a href="navigation.css" class="linksinwritten">rides</a> </li> 
    	</ul>
        <p>I'm just writing here to fill space la la la labla la vla vI'm just writing here to fill space la la la labla la vla vI'm just writing here to fill space la la la labla la vla vI'm just writing here to fill space la la la labla la vla vI'm just writing here to fill space la la la labla la </p>
    	<!-- Stuff like this is not necessary. You have a line break within paragraph tags. This is wrong; just use the line break <br />.
        <p>      <br />
          
        </p>
    	 -->
    	 <!-- It looks like you want just a link break here, so just use a line break or better yet, change the margins and padding of the paragraph "I'm just writing...." to fill this space
        <p>&nbsp; </p>
    	-->
      </div>
      <div id="middle">
        <img src="cowhorsemen.jpg" alt="this is a picture of some cowboys" width="312" height="219" />	  
        <div id="rightinfo">
            <p><img src="bullet kopiera.jpg" width="16" height="18" longdesc="bullet kopiera.jpg"></p><strong>Ride along goat tracks, through rivers and on mountain ridges in Sierra de las Nieves national park. </strong></p>
            <p>Enjoy  stunning scenery, fantastic food, wonderful horses, and friendly staff.  Join us for a great ride in Southern Spain. We are in  the white village of Monda, yet only 30 minutes drive from Jet Set  Marbella, Puerto Banus and the beach. We cater for all levels and you  can ride for as little as one hour to a full day. You could also join  us for the adventure of your life on an overnight ride or full weeks riding holiday.</p>
    		  <p>Other  activities available nearby for non-riders, such as archery, quad  biking, shooting, jeep safari, walking, swimming, art classes, golf and  tennis.</p>
        </div>
    
      </div>
    
    
    <div class="foten">Monda riding stables Sue Platt tel: 952 1245877 </div>
    </div></div>
    
    <p>&nbsp;</p><!--Again, use page breaks when necessary.-->
    </body>
    </html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •