Question

这听起来很奇怪，但是。

我正在做一个移动网站，没有什么花哨的东西，基本上在中间是我的内容与它周围的divs，我已经做了向左浮动。但是如果有意义的话，我希望整个内容本身位于中心而不会丢失彼此相邻的方框？

的index.php

<a name="top"></a>
<!doctype html>
<html>
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" lang="en-gb">
<head>
    <title>michae|dylanEdwards - artistic blog</title>

    <link rel="icon" href="favicon.ico" type="image/x-icon">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link href = "_includes/style.css" rel="stylesheet" type="text/css" media="screen" />
    <link rel="stylesheet" type="text/css" href="_includes/style.css" />
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="_includes/simplemenu.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="_includes/simplemenu.js"></script> 

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:image" content="http://www.michaeldylanedwards.co.uk/admin/uploads/op-image.png"/>
    <meta property="og:description" content="michae|dylanEdwards is a contemporary British Art and Design Student at Liverpool John Moores University. In which creates works in which provide a sociological question in regards to how society sees itself. Also by means of design."/>
    <meta name="description" content="michae|dylanEdwards is a contemporary British Art and Design Student at Liverpool John Moores University. In which creates works in which provide a sociological question in regards to how society sees itself. Also by means of design.">
    <meta name="keywords" content="art blog mickword michaeldylanedwards michae|dylanEdwards michael dylan edwards liverpool john moores university sociological history"/>

</head>

<body>

<center>
    <?php include("_includes/header.html"); ?>
    <div id="content">
        <center>
            <?PHP
                $category = "6";
                $template = "Mobile_new_home";
                $number = "6";
                include("../admin/show_news.php");
            ?>
        </center>
    </div>
    <?php include("_includes/bottom.html"); ?>
</center>

</body>
</html>

的style.css

div#content {
    width: 85%;
}

/* Front News Styles */

div#news_base {
    background-image: url(../_img/1.fw.png);
    width: 235px;
    height: 240px;
    float: left;
}

div#articles_base {
    background-image: url(../_img/1.fw.png);
    width: 235px;
    height: 240px;
    margin-bottom: 20px;
    float: left;
}

div#news_float {
    width: 20px;
    height: 20px;
    float: left;
}

div#newscontent {
    width: 235px;
    height: 205px;
}

div#newsshadow {
    background-image: url(../_img/shadow.png);
    width: 215px;
    text-align: left;
    color: #F0F0E1;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
}

div#newsshadowbottom {
    background-image: url(../_img/shadow.png);
    width: 215px;
    height: 15px;
    text-align: left;
    font-size: 10px;
    color: #F0F0E1;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
}

哈哈，任何帮助都会很棒，提前谢谢！

编辑：哦，这是移动网站：www.michaeldylanedwards.co.uk/m

Answer 1

删除.news_float类中的float：left。并将display：inline-block添加到.bloglink类中。这就是你需要做的所有事情，因为你已经给出了align-content：center;到主要的div。

  .bloglink{
        display: inline-block;
    }

    div#news_float {
        width: 20px;
        height: 20px;
    }

我能向左浮动，还能让它居中吗？

1 个答案: