Question

所以我第一次创建自己的网站，经过一系列问题后，我遇到了一个我不确定如何修复的网站。

ngkevin-art.com/about.html

这就是它在Dreamweaver中的样子以及我希望它看起来如何： http://i.imgur.com/wlOIR.jpg

但是当我进入实时视图或在线查看时，它就会崩溃。任何帮助将不胜感激。

CSS：

@charset "utf-8";
/* CSS Document */




/* General HTML Tag Rules */

body {
  width:auto;
  height:auto;
  background-image:url(images/bg_demo2.png);
  background-color:#2d2d2d;
  background-repeat:no-repeat;
  background-position:center;
  margin-top:30px;
}


@font-face {
    font-family: Harabara;
    src: url(Harabara.ttf);
    font-weight:200;
}


h1 {
  font-family: Harabara, Helvetica, Arial, sans-serif;
  font-size:150%;
  color:#CECEBC;
}


h2 {
  font-family: Harabara, Helvetica, Arial, sans-serif;
  font-size:100%;
  color:#CECEBC;
}




.text {
  margin-left:75px;
  width:auto;
  float:left;


}


#text2 {
  width:408px;
  text-align:center;


}


.text3 {
  margin-left:25px;
  width:auto;
  float:left;
}



#container {
  width:1280px;
  height:960px;
  margin-left:auto;
  margin-right:auto;


}


#wrapContact {

  width: 520px;
  height: 100px;
  margin-left:735px;
  margin-top: 10px;
  clear: both;
}


#linked {
  float:left;
  margin-top:35px;
  width: 175px;
}


#facebook {
  float:left;
  width: 200px;
  margin-left:32px;
  margin-top:25px;


}


#email {
  float:left;
  width:75px;
  margin-left:35px;
  margin-top:20px;


}


#wrapNav {


  width: 475px;
  margin-left:750px;
  margin-top:60px;
}


#demo {
  width: 500px;
  text-align:center;
  margin-top: 70px;
  margin-left:auto;
  margin-right:auto;

}


#flatbook {
  width:250px;
  margin-left:auto;
  margin-right:auto;
  margin-top:20px;

}


#wrapAbout {
  margin-left:auto;
  margin-right:auto;
  margin-top:75px;
  width: 1100px;
  height:auto;


}


#picture {
  width:408px;
  margin-top:100px;
  float:left; 
}

HTML：

<body>


    <div id="container">

      <div id="wrapContact">
            <div id="linked">
                <a href="http://www.linkedin.com/pub/kevin-ng/25/558/75b"> 
                <img src="images/logo_linked_large.png" width="auto" height="auto" border="0" alt="linkedin_logo" /> </a>
            </div>

            <div id="facebook">
                <a href="http://www.facebook.com/profile.php?id=1309131548"> 
                <img src="images/logo_fb_large.png" width="auto" height="auto" border="0" alt="facebook_logo" /> </a>
            </div>

      <div id="email">
            <a href="mailto: ngkevin.3dartist@gmail.com"> 
                <img src="images/gmail.png" width="auto" height="auto" border="0" alt="email_icon" /> </a>
            </div>
      </div> <!-- End "wrapContact"> -->

      <div id="wrapNav">

            <a href="index.html">                        
            <img src="images/bg_tab_main.png" width="auto" height="auto" border="0" alt="Main" /> </a>

            <a href="demo.html">                        
            <img src="images/bg_tab_demo.png" width="auto" height="auto" border="0" alt="Demo" /> </a>

            <a href="about.html">                        
            <img src="images/bg_tab_about.png" width="auto" height="auto" border="0" alt="About" /> </a>

      </div> 
    <!-- End "wrapNav"> -->  

      <div id="wrapAbout">

          <div id="picture">
                <img src="images/picture.jpg" width="auto" height="auto" alt="picture" />
                <div id="text2">
                    <h2> Me in the middle left, my buddies, Jordan Gabriel on the left and Edmund Zhu on the right,
                        and finally, Epic Games VIP, Cliff Bleszinski! Taken at GDC 2010. </h2>
                </div>
          </div>


          <div class="text">        
                <h1> Resume: <br/>
                <br/> Email: <br/> <br/>
                <br/> About Me:</h1>            
          </div>

          <div class="text3">
              <h1> <a href="resume/Kevin Ng Resume2.doc"> Click Here </a>
              <br/> <br/> <a href="ngkevin.3dartist@gmail.com"> ngkevin.3dartist@gmail.com </a> <br/> 
                <br/> <br/> <font size="4"> 
                    My desire to be in the game development industry is to work with other individuals that take pride in creating a game, 
                    something that can be enjoyed by a multitude of people. There is nothing I would like better than to lend my talents and 
                    artistic skills for that purpose. <br/> <br/>

                    I believe the key to creating memorable game art, whether it be characters or environments, is the story. 
                    Just like reading a good book or watching a thrilling movie, I loved to be immersed in the world of the game. As a result, 
                    I had an affinity to Role-Playing Games. Classic games of my generation such as Chrono Trigger, Final Fantasy, and Zelda 
                    showed me a world of endless imagination.  <br/> <br/>

                    The characters which are the focal point of the story, their goals and motivations, their trials and tribulations, 
                    their victories and defeats... These are the things I think about constantly when I look at them. 
                    A character without depth doesn't exist, but if they do, I can only imagine how boring that would be. </font></h1>
          </div>

        </div>

    </div><!-- End "container" -->


</body>

Answer 1

尝试为.text3类提供固定宽度。 450px看起来是正确的。

网站在Dreamweaver中看起来很好但是

1 个答案: