如何去掉HTML中PHP代码后不需要的换行符_Php_Html_Css_Line Breaks

如何去掉HTML中PHP代码后不需要的换行符

php html css

如何去掉HTML中PHP代码后不需要的换行符,php,html,css,line-breaks,Php,Html,Css,Line Breaks,所以我有一个我正在建立的博客，而困扰我的部分是post div。似乎每个元素都会自动换行。即使我让它们漂浮起来，这对我来说也不管用。即使我将填充设置为0，它也会在我不这样做的情况下不断分离div 这是索引的主体 <body> <div id="universe"> <h1>Chris's Blog</h1> <div id="content"> <div id="menu">

所以我有一个我正在建立的博客，而困扰我的部分是post div。似乎每个元素都会自动换行。即使我让它们漂浮起来，这对我来说也不管用。即使我将填充设置为0，它也会在我不这样做的情况下不断分离div

这是索引的主体

<body>

<div id="universe">




<h1>Chris's Blog</h1>


    <div id="content">

        <div id="menu">
        <?php 
            $temp = $_SESSION['username'];
            $real = get_full_name($temp);
            if(isset($_SESSION['username']))
            {
                echo '<br />'.'Welcome back, '. $real['name'] . ' ' . $real['last_name'] . '.';
            }
    ?>
    </div>
    <div id="subcontent">

        <div id="posts">


 <?php

foreach( $posts as $post)
{
    if( ! category_exists('name', $post['name']))
    {
        $post['name'] = 'Uncategorized';
}
?>

<div class="post">
    <div id="post_title">
        <h2><a href="index.php?id=<?php echo $post['post_id']; ?>"><?php echo $post['title']; ?></a></h2>
            <p>Posted on <?php echo date('d-m-Y h:i:s', strtotime($post['date_posted'])); ?> in <a href="category.php?id=<?php echo $post['category_id']; ?>"><?php echo $post['name']; ?></a>
                </p>

    </div>


    <div id="post_content">

<?php echo nl2br($post['contents']); ?></div>

<?php // check if session has been set
if(isset($_SESSION['username']))
{
        ?><div id="post_edit">
        <p><a href="delete_post.php?id=<?php echo $post['post_id']; ?>">Delete post</a></p>
    </div>
        <?php
    }
        ?>
</div>
<?php
}

?>
        </div>

        <div id="rightbar">
        <ul>
            <li><a href="index.php">Home</a></li>
            <?php 
                if( isset($_SESSION['username']))
                {
                    echo '<li><a href="add_post.php">Add Post</a></li>',
                        '<li><a href="add_category.php">Add Category</a></li>',
                        '<li><a href="logout.php">Logout</a></li>';
                }

                ?>
            <li><a href="index.php">Contact</a></li>
            <?php
            if(! isset($_SESSION['username']))
            {
                echo '<li><a href="login.php">Login</a></li>';
            }
            ?>
        </ul>
        </div>

    </div>

</div>

在post content div中，您正在使用

<div id="post_content">;
    <?php echo nl2br($post['contents']); ?>;
</div>;

要隐藏post\u内容中的所有br：

假设在post div上方的foreach循环中，您可能会在页面上显示多篇文章，那么post\u标题和post\u内容div应该是类，因为ID是唯一的元素标识符。也就是说，请在将ID更改为类后尝试以下操作：

div.post .post_title {
    float:left;
    font-size:12px;
    width:580px;
}

    div.post .post_title h2 {
        margin: 0;
        padding: 0
    }

div.post .post_content {
    float:left;
    width:580px;
}

    div.post .post_content p {
        margin: 0;
        padding: 0;
    }

div.post .post_edit p {
    margin: 0;
    padding: 0;
}

或者，您可以尝试：

div.post * {
    margin: 0;
    padding: 0;
}

或者尝试使用CSS重置，例如：

使用上述任何一种方法，您可以根据需要设置边距和填充。

也许您忘记了一些css文件？你试过JSFIDLE吗？或者发布一个用JSFIDLE而不是PHP编写HTML代码的示例，您的css也不适合ID使用，也不适合类使用。例如：post_title{…}首先，CSS中的post_title和post_内容应该是post_title和post_内容是的，对不起，我把它们拿出来了，因为出于某种原因stackoverflow不会把它当作代码？我将再次尝试编辑它们。

div.post .post_title {
    float:left;
    font-size:12px;
    width:580px;
}

    div.post .post_title h2 {
        margin: 0;
        padding: 0
    }

div.post .post_content {
    float:left;
    width:580px;
}

    div.post .post_content p {
        margin: 0;
        padding: 0;
    }

div.post .post_edit p {
    margin: 0;
    padding: 0;
}

div.post * {
    margin: 0;
    padding: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

// Display block in IE6-9 and FF3
// -------------------------

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

// Prevents modern browsers from displaying 'audio' without controls
// -------------------------

audio:not([controls]) {
    display: none;
}

// Base settings
// -------------------------

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
// Focus states
a:focus {
  .tab-focus();
}
// Hover & Active
a:hover,
a:active {
  outline: 0;
}

// Prevents sub and sup affecting line-height in all browsers
// -------------------------

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}

// Img border in a's and image quality
// -------------------------

img {
  max-width: 100%; // Make images inherently responsive
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

// Prevent max-width from affecting Google Maps
#map_canvas img {
  max-width: none;
}

// Forms
// -------------------------

// Font size in all browsers, margin changes, misc consistency
button,
input,
select,
textarea {
  margin: 0;
  font-size: 100%;
  vertical-align: middle;
}
button,
input {
  *overflow: visible; // Inner spacing ie IE6/7
  line-height: normal; // FF3/4 have !important on line-height in UA stylesheet
}
button::-moz-focus-inner,
input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  padding: 0;
  border: 0;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer; // Cursors on all buttons applied consistently
  -webkit-appearance: button; // Style clickable inputs in iOS
}
input[type="search"] { // Appearance in Safari/Chrome
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
}
textarea {
  overflow: auto; // Remove vertical scrollbar in IE6-9
  vertical-align: top; // Readability and alignment cross-browser
}