Back To Website Design Forum

tables and include files

  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Joined: Mar 12, 2007
  • Posts: 6228
  • Loc: South-Africa
  • Status: Offline

Post November 27th, 2007, 1:17 am

I'm not talking bad to you, I'm just saying that your code is hard to understand ... and by fixing that validation errors you'll know it's not something silly that you missed or a tag that you forgot to close or something like that ...
Let's leave all our *plum* where it is and go live in the jungle ...
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post November 27th, 2007, 1:17 am

  • Benat
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Jul 19, 2004
  • Posts: 2123
  • Status: Offline

Post November 27th, 2007, 1:26 am

The reason your page isn't working properly is because you have about 18 <body> tags in there. You only need ONE to open and close. I have no idea what you were thinking when you coded that site, but its wrong, wrong, wrong!

If you want your site to WORK for everyone, you need to redesign it properly. Validate it, and then if you have a problem, come and ask, cos at the moment, no one can help you.
JOIN OZZU'S FACEBOOK GROUP!
  • olm75
  • Proficient
  • Proficient
  • No Avatar
  • Joined: Aug 07, 2005
  • Posts: 294
  • Status: Offline

Post November 27th, 2007, 1:41 am

ok can u tell me how to fix this then its in div css now but how do i fix this please look at how this appears in the browser
http://www.getflap.com/getflap2/index.php

Code: [ Select ]
<html>
<head>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Styles (index.psd) -->
<style type="text/css">
<!--

#Table_01 {
    position:absolute;
    left:0px;
    top:0px;
    width:775px;
    height:735px;
}

#index-01 {
    position:absolute;
    left:0px;
    top:0px;
    width:25px;
    height:668px;
}

#logo {
    position:absolute;
    left:25px;
    top:0px;
    width:212px;
    height:99px;
}

#index-03 {
    position:absolute;
    left:237px;
    top:0px;
    width:284px;
    height:99px;
}

#index-04 {
    position:absolute;
    left:521px;
    top:0px;
    width:229px;
    height:99px;
}

#index-05 {
    position:absolute;
    left:750px;
    top:0px;
    width:25px;
    height:668px;
}

#index-06 {
    position:absolute;
    left:25px;
    top:99px;
    width:725px;
    height:10px;
}

#index-07 {
    position:absolute;
    left:25px;
    top:109px;
    width:550px;
    height:234px;
}

#index-08 {
    position:absolute;
    left:575px;
    top:109px;
    width:175px;
    height:263px;
}

#navBar {
    position:absolute;
    left:25px;
    top:343px;
    width:550px;
    height:29px;
}

#featuredHomes {
    position:absolute;
    left:25px;
    top:372px;
    width:176px;
    height:296px;
}

#body {
    position:absolute;
    left:201px;
    top:372px;
    width:373px;
    height:296px;
}

#testimonials {
    position:absolute;
    left:574px;
    top:372px;
    width:176px;
    height:218px;
}

#index-13 {
    position:absolute;
    left:574px;
    top:590px;
    width:176px;
    height:78px;
}

#footerNav {
    position:absolute;
    left:0px;
    top:668px;
    width:775px;
    height:67px;
}

-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (index.psd) -->
<div id="Table_01">
    <div id="index-01">
        <img src="images/index_01.jpg" width="25" height="668" alt="">
    </div>
    <div id="logo">
        <img src="images/logo.jpg" width="212" height="99" alt="">
    </div>
    <div id="index-03">
        <img src="images/index_03.jpg" width="284" height="99" alt="">
    </div>
    <div id="index-04">
        <img src="images/index_04.jpg" width="229" height="99" alt="">
    </div>
    <div id="index-05">
        <img src="images/index_05.jpg" width="25" height="668" alt="">
    </div>
    <div id="index-06">
        <img src="images/index_06.jpg" width="725" height="10" alt="">
    </div>
    <div id="index-07">
        <img src="images/index_07.jpg" width="550" height="234" alt="">
    </div>
    <div id="index-08"><?php include('Tsearch.php'); ?></div>
    <div id="navBar">
        <img src="images/navBar.jpg" width="550" height="29" alt="">
    </div>
    <div id="featuredHomes">
        <img src="images/featuredHomes.jpg" width="176" height="296" alt="">
    </div>
    <div id="body">
        <img src="images/body.jpg" width="373" height="296" alt="">
    </div>
    <div id="testimonials">
        <img src="images/testimonials.jpg" width="176" height="218" alt="">
    </div>
    <div id="index-13">
        <img src="images/index_13.jpg" width="176" height="78" alt="">
    </div>
    <div id="footerNav">
        <img src="images/footerNav.jpg" width="775" height="67" alt="">
    </div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>
  1. <html>
  2. <head>
  3. <title>index</title>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. <!-- ImageReady Styles (index.psd) -->
  6. <style type="text/css">
  7. <!--
  9. #Table_01 {
  10.     position:absolute;
  11.     left:0px;
  12.     top:0px;
  13.     width:775px;
  14.     height:735px;
  15. }
  17. #index-01 {
  18.     position:absolute;
  19.     left:0px;
  20.     top:0px;
  21.     width:25px;
  22.     height:668px;
  23. }
  25. #logo {
  26.     position:absolute;
  27.     left:25px;
  28.     top:0px;
  29.     width:212px;
  30.     height:99px;
  31. }
  33. #index-03 {
  34.     position:absolute;
  35.     left:237px;
  36.     top:0px;
  37.     width:284px;
  38.     height:99px;
  39. }
  41. #index-04 {
  42.     position:absolute;
  43.     left:521px;
  44.     top:0px;
  45.     width:229px;
  46.     height:99px;
  47. }
  49. #index-05 {
  50.     position:absolute;
  51.     left:750px;
  52.     top:0px;
  53.     width:25px;
  54.     height:668px;
  55. }
  57. #index-06 {
  58.     position:absolute;
  59.     left:25px;
  60.     top:99px;
  61.     width:725px;
  62.     height:10px;
  63. }
  65. #index-07 {
  66.     position:absolute;
  67.     left:25px;
  68.     top:109px;
  69.     width:550px;
  70.     height:234px;
  71. }
  73. #index-08 {
  74.     position:absolute;
  75.     left:575px;
  76.     top:109px;
  77.     width:175px;
  78.     height:263px;
  79. }
  81. #navBar {
  82.     position:absolute;
  83.     left:25px;
  84.     top:343px;
  85.     width:550px;
  86.     height:29px;
  87. }
  89. #featuredHomes {
  90.     position:absolute;
  91.     left:25px;
  92.     top:372px;
  93.     width:176px;
  94.     height:296px;
  95. }
  97. #body {
  98.     position:absolute;
  99.     left:201px;
  100.     top:372px;
  101.     width:373px;
  102.     height:296px;
  103. }
  105. #testimonials {
  106.     position:absolute;
  107.     left:574px;
  108.     top:372px;
  109.     width:176px;
  110.     height:218px;
  111. }
  113. #index-13 {
  114.     position:absolute;
  115.     left:574px;
  116.     top:590px;
  117.     width:176px;
  118.     height:78px;
  119. }
  121. #footerNav {
  122.     position:absolute;
  123.     left:0px;
  124.     top:668px;
  125.     width:775px;
  126.     height:67px;
  127. }
  129. -->
  130. </style>
  131. <!-- End ImageReady Styles -->
  132. </head>
  133. <body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
  134. <!-- ImageReady Slices (index.psd) -->
  135. <div id="Table_01">
  136.     <div id="index-01">
  137.         <img src="images/index_01.jpg" width="25" height="668" alt="">
  138.     </div>
  139.     <div id="logo">
  140.         <img src="images/logo.jpg" width="212" height="99" alt="">
  141.     </div>
  142.     <div id="index-03">
  143.         <img src="images/index_03.jpg" width="284" height="99" alt="">
  144.     </div>
  145.     <div id="index-04">
  146.         <img src="images/index_04.jpg" width="229" height="99" alt="">
  147.     </div>
  148.     <div id="index-05">
  149.         <img src="images/index_05.jpg" width="25" height="668" alt="">
  150.     </div>
  151.     <div id="index-06">
  152.         <img src="images/index_06.jpg" width="725" height="10" alt="">
  153.     </div>
  154.     <div id="index-07">
  155.         <img src="images/index_07.jpg" width="550" height="234" alt="">
  156.     </div>
  157.     <div id="index-08"><?php include('Tsearch.php'); ?></div>
  158.     <div id="navBar">
  159.         <img src="images/navBar.jpg" width="550" height="29" alt="">
  160.     </div>
  161.     <div id="featuredHomes">
  162.         <img src="images/featuredHomes.jpg" width="176" height="296" alt="">
  163.     </div>
  164.     <div id="body">
  165.         <img src="images/body.jpg" width="373" height="296" alt="">
  166.     </div>
  167.     <div id="testimonials">
  168.         <img src="images/testimonials.jpg" width="176" height="218" alt="">
  169.     </div>
  170.     <div id="index-13">
  171.         <img src="images/index_13.jpg" width="176" height="78" alt="">
  172.     </div>
  173.     <div id="footerNav">
  174.         <img src="images/footerNav.jpg" width="775" height="67" alt="">
  175.     </div>
  176. </div>
  177. <!-- End ImageReady Slices -->
  178. </body>
  179. </html>
  • celandine
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Oct 30, 2007
  • Posts: 2008
  • Loc: Belgrade, Serbia
  • Status: Offline

Post November 27th, 2007, 3:37 am

I can't see it - says 'page cannot be found....' I tried to open it in dreamweaver and I can see the divs but not any of the images or text, so I don't know what you need.... if you can make the link work I can help more maybe
Eagles may soar in the sky but weasels don't get sucked into jet engines.

celandine designblog
  • olm75
  • Proficient
  • Proficient
  • No Avatar
  • Joined: Aug 07, 2005
  • Posts: 294
  • Status: Offline

Post November 27th, 2007, 4:31 am

my bad here it is...http://www.getflap.com/index.php
  • Zwirko
  • Guru
  • Guru
  • User avatar
  • Joined: May 29, 2005
  • Posts: 1417
  • Loc: 55° N, 3° W
  • Status: Offline

Post November 27th, 2007, 7:04 am

One of the best things you can do is to make sure your markup at least has some semblance of valididty to it. Your code is all messed up - and so expecting a browser to deal with this and know what you want is not going to be an easy thing to achieve. Finding "fixes" here is really just going to be hiding the errors and not helping you in the long run. Any subsequent changes you make after a fix will likey blow the thing apart again. You need to get the code cleaned up and valid as a first priority.

Use the w3c markup validation service.

Secondly, since this (that site) is a business I would strongly suggest doing this project in a more "standard" manner. If it's your business then this is even more important. Ditch the ImageReady stuff ... all that slicing and dicing is not doing you any favours at all. There are many free tools to make websites that give far more friendly results than a graphics program ever can. 385 Kb's worth of sliced images is a bit crazy (and totally unnecessary) for such a simple-to-achieve-by-other-means design. For a property site, your design is not great but does fit into the crowd well (that's not an insult, I just mean that it looks like a property site if you know what I mean?) so there is no major problem in this regard. But under the hood it kinda stinks.

Just my thoughts.
  • jameson5555
  • Bronze Robot
  • Bronze Member
  • User avatar
  • Joined: Oct 02, 2007
  • Posts: 575
  • Loc: Phoenix, AZ
  • Status: Offline

Post November 28th, 2007, 9:26 am

I don't want to sound redundant, but the first step to any web page problem-solving should be validating the code with the W3C. Not only will it potentially fix the problem, but it will help you understand all that wacky code that Imageready is kicking out.

A good learning tool would be to rename all those divs so they mean something to you. That'll help you understand what everything on your page is doing.

As cool as PHP includes are, I think it's important to have a solid fundamental understanding of HTML and CSS before trying to incorporate something like PHP in.
phoenix web design
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Joined: Mar 12, 2007
  • Posts: 6228
  • Loc: South-Africa
  • Status: Offline

Post November 28th, 2007, 11:53 am

Nicely said Jameson5555 ... *applauds*
Let's leave all our *plum* where it is and go live in the jungle ...
  • littlephoenix
  • Graduate
  • Graduate
  • User avatar
  • Joined: Oct 31, 2006
  • Posts: 149
  • Status: Offline

Post November 29th, 2007, 12:55 am

Suikolove wrote:
I hope you're not designing sites for money. If you are, then you need to stop. Right now, and take a break until you become intermediate with CSS and Divs.


i dont think its nice to tell him to not make sites, we all have our own unique ways of design and one only learns when once does ;)
  • olm75
  • Proficient
  • Proficient
  • No Avatar
  • Joined: Aug 07, 2005
  • Posts: 294
  • Status: Offline

Post November 29th, 2007, 12:49 pm

thank you i am new to using css and divs my main specialty is programming....
  • jameson5555
  • Bronze Robot
  • Bronze Member
  • User avatar
  • Joined: Oct 02, 2007
  • Posts: 575
  • Loc: Phoenix, AZ
  • Status: Offline

Post November 29th, 2007, 1:00 pm

olm75 wrote:
thank you i am new to using css and divs my main specialty is programming....

Welcome to the world of CSS :)

I think you'll like it a lot once you start seeing the logic behind it. It's so much easier to work with than tables.
phoenix web design
  • olm75
  • Proficient
  • Proficient
  • No Avatar
  • Joined: Aug 07, 2005
  • Posts: 294
  • Status: Offline

Post November 29th, 2007, 1:10 pm

thats what im trying to do im finding out with exeption of some stuff its not that complicated, and another thing is it wise to us photoshop to send the page to dreamweaver...
  • jameson5555
  • Bronze Robot
  • Bronze Member
  • User avatar
  • Joined: Oct 02, 2007
  • Posts: 575
  • Loc: Phoenix, AZ
  • Status: Offline

Post November 29th, 2007, 1:26 pm

olm75 wrote:
thats what im trying to do im finding out with exeption of some stuff its not that complicated, and another thing is it wise to us photoshop to send the page to dreamweaver...

That's how I used to do it back in the day. Dreamweaver makes it pretty easy to change some of the images from foreground images to background images and add actual text on top of them without having to know any code.

I do think hand-coding is the best way to get perfect code, but Dreamweaver is definitely a step in the right direction!
phoenix web design
  • olm75
  • Proficient
  • Proficient
  • No Avatar
  • Joined: Aug 07, 2005
  • Posts: 294
  • Status: Offline

Post November 29th, 2007, 3:20 pm

i am having trouble with the layout from photoshop, how do u do it
  • jameson5555
  • Bronze Robot
  • Bronze Member
  • User avatar
  • Joined: Oct 02, 2007
  • Posts: 575
  • Loc: Phoenix, AZ
  • Status: Offline

Post November 29th, 2007, 3:29 pm

olm75 wrote:
i am having trouble with the layout from photoshop, how do u do it

You mean you're having trouble getting it into dreamweaver or editing it once you're in there or something else?
phoenix web design
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post November 29th, 2007, 3:29 pm

1, 2, 3, 4

Post Information

  • Total Posts in this topic: 46 posts
  • Users browsing this forum: No registered users and 111 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.