9

A failed attempt to align the DIV elements

 3 years ago
source link: https://www.codesd.com/item/a-failed-attempt-to-align-the-div-elements.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

A failed attempt to align the DIV elements

advertisements

I am trying to align 3 <div> elements in such way that two are next to each other, and the third is under them, stretching from one to another. Here is my Fiddle for you to see. Also here's my css:

<style type="text/css">
body {
    background-image: url(https://www.dropbox.com/s/ri903jtb93a5168/background.jpg);
    background-attachment:fixed;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    background-repeat:no-repeat;
    background-position:center;
    padding-right: 20%;
    padding-left: 20%;
    padding-top: 19%;
}
#left {
    float: left;
    width: 25%;
    text-align: center;
}
#right {
    float: right;
    width: 25%;
    text-align: center;
}

#bottom {
    position:relative
}

.lists {
    background: transparent;
    width: 268px;
    padding: 5px;
    font-size: 16px;
    border: none;
    height: 34px;
    -webkit-appearance: none;
}
</style>​

Any ideas? I'm new and trying to get a hold of css.

Thanks!

I kinda changed you code a bit, I added clear:float, after the left and right div.

please take look at the Demo, do let me know if thats what you wanted


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK