是否可以在没有位置的情况下修复此css:relative?

时间:2014-11-03 03:06:56

标签: html css html5 css3

我正在尝试创建一个有效的评论框,但我只是遇到一些小问题,我试图像这样创建它

http://puu.sh/cBbFh/16a66b64d3.png

我知道如何做,但完全破坏了不同屏幕尺寸的视图。

我的CSS:

.search69 {
padding: 40px;
background: #232323;
}

我的代码(使用PHP和HTML)

        <div class="search69">


        <?php

if(isset($_POST['submit'])  
    && !empty($_POST['name']) 
    && !empty($_POST['comment']) ){

$name=$_POST['name'];
$comment=$_POST['comment'];
$submit=$_POST['submit'];


$insert=mysql_query("INSERT INTO comment (name,comment) VALUES ('$name','$comment') ");
echo "<meta HTTP-EQUIV='REFRESH' content='0; url=service.php'>";
}
else
{
echo "";
}
?>





        <form class="comments" action="service.php" method="POST">

<table>

<tr><td><h2>Name: </h2><br><input type="text" name="name" required/></td></tr>
<tr><td colspan="2"><h2>Comment:</h2></td></tr>
<tr><td colspan="5"><textarea name="comment" rows="10" cols="32" required></textarea></td></tr>
<tr><td colspan="2"><input type="submit" name="submit" value="Comment"></td></tr>

</table>
</form>



<?php


$getquery=mysql_query("SELECT * FROM comment ORDER BY id DESC");
while($rows=mysql_fetch_assoc($getquery))
{
$id=$rows['id'];
$name=$rows['name'];
$comment=$rows['comment'];
echo '<h2><hr size="1"/>Posted By..<br>' . $name . '<h2><br/>' . '<br/>' . $comment . '<br/>' . '<br/>' . '<hr size="1"/>'
;}



?>



</div>

任何想法?谢谢!

1 个答案:

答案 0 :(得分:2)


除此之外 - 您需要更新PHP

mysql_*个功能不再支持,它们为officially deprecated不再维护,将为removed个未来。您应该使用PDOMySQLi更新代码,以确保将来的项目功能。


<table>放下,莎拉,我们会忘记这件事发生过。

  • 该表格及其<td><tr>元素

  • 已删除
  • 表单包含在div

  • div包装器有一个合理的max-width

  • 表单元素的位置为display: block,可将它们移动到各自的行中

  • 标签包含在<label>中,其for属性与其输入/ textareas id属性相匹配。

  • 提交评论已更改为<button>元素。按钮的工作方式相同,但在CSS样式方面更灵活

  • <hr>被替换为边框

工作示例

.formContainer {
  padding: 20px;
  background: #232323;
  color: #FFF;
  max-width: 500px;
}
h2 {
  font-weight: normal;
}
h2 span {
  display: block;
}
input,
textarea,
label {
  display: block;
  margin: 10px 0;
}
textarea {
  width: 99%;
  height: 200px;
}
form {
  border-bottom: solid 1px #FFF;
}
form button {
  padding: 10px 40px;
  margin-bottom: 10px;
}
.formContainer p {
  font-size: 1.2em;
  text-transform: uppercase;
}
.formContainer p:last-child {
  padding-bottom: 10px;
  border-bottom: solid 1px #FFF;
  margin: 0;
}
label {
  text-transform: uppercase;
}
<div class="formContainer">
  <form class="comments" action="service.php" method="POST">

    <label for="name">Name</label>
    <input type="text" id="name" name="name" required/>
    <label for="comment">Comment</label>
    <textarea name="comment" id="comment" required></textarea>
    <button type="submit" name="submit" value="Comment">Comment</button>


  </form>

  <h2>Posted By<span>Matt</span></h2>
  <p>I love puppies!</p>


</div>

复制粘贴

<div class="formContainer">

<?php
if(isset($_POST['submit'])  
    && !empty($_POST['name']) 
    && !empty($_POST['comment']))
{

$name=$_POST['name'];
$comment=$_POST['comment'];
$submit=$_POST['submit'];

    // !! This needs to be replaced with PDO / mysqli !!
    // !! At the moment this is wide open for SQL injection !!
    $insert=mysql_query("INSERT INTO comment (name,comment) VALUES ('$name','$comment') ");
    echo "<meta HTTP-EQUIV='REFRESH' content='0; url=service.php'>";
}

?>





<form class="comments" action="service.php" method="POST">
    <label for="name">Name</label>
    <input type="text" id="name" name="name" required/>
    <label for="comment">Comment</label>
    <textarea name="comment" id="comment" required></textarea>
    <button type="submit" name="submit" value="Comment">Comment</button>
</form>



<?php


$getquery=mysql_query("SELECT * FROM comment ORDER BY id DESC");
while($rows=mysql_fetch_assoc($getquery))
{
    $id=$rows['id'];
    $name=$rows['name'];
    $comment=$rows['comment'];
    echo '<h2>Posted By<span>' . $name . '</span></h2> <p>' . $comment . '</p>';
}



?>



</div>