Question

这是我的HTML

<!DOCTYPE html>
<html>
    <head>
    <title>
        Oaki Softworks
    </title>
    <link href='style.css' rel='stylesheet' type='text/css'>
    <link rel="icon" href="favicon.png">
</head>
<body>
    <div id="navigation">
        <div style="height:20px;width=15%;float:right;">
            <a href="https://www.facebook.com/oakisoftworks/?fref=ts"><img src="facebook_icon.png" class="social_media_icon"></a>
            <img src="instagram_icon.png" class="social_media_icon">
            <img src="twitter_icon.png" class="social_media_icon">
            <img src="youtube_icon.png" class="social_media_icon">
        </div>
        <div class="navigation_tile">Contact Us</div>
        <div class="navigation_tile">Careers</div>
        <div class="navigation_tile">Products</div>
        <div class="navigation_tile">About Us</div>
    </div>
    <div id="content">
        <div id="blurb">
            <img src="Logo%20(inverted,%20transparent).png" style="width:90%;height:auto;align-self:center;">
            <h2>Video games as art.</h2>
            <p>Even before the conception of our company, we have always embraced video games as the newest, emerging art form. Video games engage an audience like no other medium: allowing them to digest the material at their own pace, to identify themselves within their avatar as they see fit, and to interact with the world around them. Oaki Software aims to underline these elements of art even further with our own game design.</p>
        </div>
        <div id="main_pic">
            <img src="art.jpg">
        </div>
    </div>
    <div id="footer">
        <p>
            Oaki Softworks&trade;
            <br>Fort Collins, CO 80521
            <br>benkulka@oakisoftworks.com
        </p>
    </div>
</body>
</html>

这是我的CSS

body {
    background-color: #021034;
    padding: 0px;
    margin: 0px;
}

#navigation {
    position: fixed;
    background-color: black;
    height: 40px;
    width: 100%;
    color: white;
    color: #adb7bd;
    font-family: 'Lucida Sans', Arial, sans-serif;
    font-size: 16px;
    line-height: 26px;
}

div.navigation_tile {
    height: 30px;
    width: 15%;
    align-content: center;
    text-align: center;
    float: right;
    margin: 5px;
}

div.navigation_tile:hover {
    background-color: #092466;   
}

div.navigation_tile:active {
    background-color: white;
    color: black;
}

#content {
    margin-top: 30px;
    display: inline-block;
    text-align: justify;
}

#blurb{
    padding: 40px 0 0 25px;
    width: 28%;
    height: 250px;
}

#main_pic {
    float: right;
    width: 66%;
    height: 250px;
    border: 10px #092466 solid;
    overflow: hidden;
}

h1{
    color: #A5B7E3;
    font-family: 'Lato', sans-serif;
    font-size: 54px;
    font-weight: 300;
    line-height: 58px;
    margin: 0 0 20px;
}

h2 {
    color: #6681C4;
    font-family: 'Lato', sans-serif;
    font-size: 34px;
    margin: 0 0 10px;
}

p{
    text-indent: 20px;
    color: white;
    font-size: 12px;
    font-weight: 100;
    font-family: 'Lucida Sans', Arial, serif;
    line-height: 20px;
}

img.social_media_icon{
    height: 15px;
    width: 15px;
    padding: 5px;
}

#footer {
    height: auto;
    width: 100%;
    background-color: black;
    text-align: center;
    padding: 5px;
}

我试图让我的#blurb div与我父母#content div中的#main_pic div对齐，但我却遇到了麻烦。有人能指出我正确的方向吗？

Answer 1

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow>


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:textSize="18sp"
        android:textColor="#800080"
        android:id="@+id/txt1">
    </TextView>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:textSize="18sp"
        android:textColor="#800080"
        android:id="@+id/txt2">
    </TextView>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:textSize="18sp"
        android:textColor="#800080"
        android:id="@+id/txt3">
    </TextView>
    <Button
        android:id="@+id/del_button"
        android:text="Delete"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:onClick="addItems"
        android:layout_gravity="right"
        android:theme="@style/MyButton"/>

</TableRow>

还考虑去除高度：250px;来自#blurb ...很难说是出于某种原因需要它。

为什么我的divs排队？

1 个答案: