New at php + css. (questions/feedback on what I did wrong)

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Nouman6
    New Member
    • Jun 2007
    • 11
    #1

    New at php + css. (questions/feedback on what I did wrong)

    Hey everyone, my first post here :D

    I am new to the css style of making a web page. I usually just use the html and iframe method.

    my problem is...I don't really know HOW to use php and css together. I am trying it and so far so good except one thing. I dont think it's correct xD and I cant get a div to go where I want it to or check with the css for it's style.

    IF YOU DONT WANT TO READ ALL OF IT GO DOWN FOR A LINK TO DOWNLOAD THE FILES. (90kb very tiny and quick download in .rar folder)



    My index.php:
    Code:
    <?php include("layout.php"); ?>


Hello

THIS IS THE BLAH and the sjdfl kjds fdsjf dkslfj dskf ldksjf sdjfk jdklfj dfkj sfkj dkslfj dlfjlskdf dsfj fdsljflka dfkjd fjlkajk dfkjd aslfjdlkf skljdf kdsjlfaj fkjldk ajkljdf kajfkla jdfkjd aslkj fkldjfkl ajfklj adlkf
<?php include("content.php"); ?>

<?php include("bottom.php"); ?>
    My layout .php
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="styles.css" media="screen"/>


<title>Nouman Layout, lol</title>
<style type="text/css">
<!--
.style3 {	color: #92c240;
	font-size: 18px;
}
.style5 {font-family: Verdana, Arial, Helvetica, sans-serif}
.style6 {color: #92c240; font-size: 20px; }
.style7 {font-family: Arial, Helvetica, sans-serif}
-->
</style>
</head>
<body>
<div id="wrapper">
<div align="center">
</div>
<div id="header">
<div class="headertext">
  <div align="center">Nouman Layout, lol
  </div>
</div>
</div>
    my content.php:
    Code:
    <div id="main">
    my bottom.php
    Code:
    </div>
<div align="center">
</div>
<div id="content">
<div id="buttonrow">
  <div align="center">
<a href=" index.html" accesskey="i" class="button"> Home</a>
<a href=" about.html" accesskey="h" class="button"> About</a>
<a href=" work.html" accesskey="w" class="button"> Shopping &nbsp; >></a>
<a href=" contact.html" accesskey="c" class="button"> Resturants &nbsp; >></a>
<a href=" contact.html" accesskey="c" class="button"> Family  &nbsp; >></a>
<a href=" contact.html" accesskey="c" class="button"> Contact  &nbsp; >></a>  
   </div>
</div>
<div id="right">
   <div align="center"> What's New </div>
</div>
</div>
<div align="center">
<div id="footer">
  <div align="center">© Copyright or whatever Nouman 2006</div>
  </body>
</html>
    Finely my styles.css:
    Code:
    html {
font-family: 'trebuchet ms', sans-serif; 
font-size: 16px; 
font-weight: bold; 
letter-spacing: -1px;
color: #000;
}


#wrapper {
	margin: 20px auto;
	width: 812px;
}

#header {
margin-top: 2px;
background: url( Final_03.gif);
height: 102px;
width: 812px;
}

#header .headertext {
font-family: 'trebuchet ms', sans-serif; 
font-size: 20px; 
font-weight: bold; 
letter-spacing: px;
padding-top: 60px;
text-align: center;
color: #fff;
}

#content {
background: url(Final_06.gif) repeat-y;
width: 812px;
padding-bottom: 300px;
}



#main {
font-family: 'trebuchet ms', sans-serif; 
font-size: 8px;
margin-left: 200px;
margin-right: 200px;
width: 400px;
background: #FFFFF;
		}



#buttonrow {
background: url(Greybar.gif) repeat-y;
display: inline;
float: left;
width: 155px;
height: 250px;
  margin-left: 18px;
overflow: hidden;
}

a.button {
  float: left;
  width: 140px;
  height: 26px;  
  margin-left: 18px;
  background: url( button.gif) no-repeat 0 0;
  font-family: 'trebuchet ms', sans-serif; 
  font-size: 14px;
  margin-left: 0px; 
  letter-spacing: 1px;
  text-align: left;
  color: #FFFFFF;
  text-decoration: none;
}

a:hover.button  {
  background-position: 0 -26px;
}

#right {
background: url(Greybar1.gif) repeat-y;
display: inline;
float: right;
width: 155px;
height: 250px;
overflow: hidden;
}

#footer {
overflow: hidden;
background: url(Final_08.gif);
height: 41px;
width: 812px;
font-family: 'trebuchet ms', sans-serif; 
font-size: 22px; 
font-weight: bold; 
letter-spacing: -1px;
color: #fff;
text-align: center;
line-height: 42px;
}
    LINK:
    http://www.sendspace.c om/delete/s2cc6n/wfvoq
    Tags: None
    • Motoma
      Recognized Expert Specialist
      • Jan 2007
      • 3236
      #2
      What you first need to realize is that a PHP file is a program that generates HTML (or whatever else you want it to). To debug the CSS, navigate to the site, and do a simple view source. Find out what your errors are in the HTML, and try to navigate to the PHP that is causing it.

        Comment

        • Nouman6
          New Member
          • Jun 2007
          • 11
          #3
          I don't have an error, actually what I need is for this:

          404 Not Found
          http://img106.imageshack.us/img106/8719/problemit3.png


          notice the text div? I want that to be in the center of the left(navy) and right div and be aligned on the top as well.

            Comment

            • Motoma
              Recognized Expert Specialist
              • Jan 2007
              • 3236
              #4
              Originally posted by Nouman6
              I don't have an error, actually what I need is for this:
              notice the text div? I want that to be in the center of the left(navy) and right div and be aligned on the top as well.
              I understand now. I have moved your thread to the HTML/CSS forum.

                Comment

                • drhowarddrfine
                  Recognized Expert Expert
                  • Sep 2006
                  • 7434
                  #5
                  The link is to where to delete the file and not the download itself. cut/pasting this doesn't work but I'm still looking at it.

                    Comment

                    • drhowarddrfine
                      Recognized Expert Expert
                      • Sep 2006
                      • 7434
                      #6
                      1) I would not style <html> but apply all that to the body instead.
                      2) You declare html transitional but are using Xhtml end tags: />. Lose the slash. Sometimes a browser stops all processing at that point.
                      3) New pages should be created using the strict doctype and without deprecated elements.
                      4) You have a case of 'divitis' where everything is in a <div>. Divs are used to help create structure by grouping related elements. Positioning is a bonus but all elements can be positioned on their own and don't need a div.

                      There's too much missing in the posted code to pinpoint what is going on. Can you get this online with everything? I mean the generated html/css. The PHP is not useful.

                        Comment

                        • Nouman6
                          New Member
                          • Jun 2007
                          • 11
                          #7
                          here, sorry for wasting your time with the delete link xD I had copied the wrong link.

                          http://www.sendspace.c om/file/g7r4k7

                          that should be it. :D

                            Comment

                            • Nouman6
                              New Member
                              • Jun 2007
                              • 11
                              #8
                              (can't edit :( )

                              anyways nvm I have got it to work out fine.

                              now if anyone can look into my new files and fix what I did stupidly or what is unneeded and stuff like that and send it back so I can review it, that would be LOVELY! I really want to get this stuff nailed down the right way from the start so I don't continue on the wrong path.



                              http://www.sendspace.c om/file/xl1hoq

                                Comment

                                Previous template Next
                                Working...