简体   繁体   中英

I am not getting my text and scroll images side by side?

I am writing a code for "Contact us" page of our website. Now I want my details on the left side and the address map (which i copied from google maps) on the right side of the website. But the map image is on the top side of the page and the details on the bottom of it. How can i resolve this??

Here's the code:

<html> 
    <div class="scroll">
        <div class="child"></div>
    </div>

    <address style="font-weight: bold">
        <h4>     "   "  </h4>
        <h4>Mark Doug</h4>
        <p><a href=" ">Mark.doug2010@abcd.in</a></p>
        <p>H-445,Silver square street<br /> </p>
        <p> CA</p>
    </address>

    <style>
    .scroll{
        overflow:scroll;
        width:500px;
        height:357px;
        margin-left:682px;
        margin-bottom:700px;
        margin-top: 0px;
    }
    .child{width:1000px;height:1000px;background-image:url(vit.png);}
    </style>
</html>

Also, when i try to get the "vit.png" image to top, the text automatically goes to the bottom side.

I have tried putting div class="scroll" inside the address tag but still the same result.

Try using the css rule .element {float:left} but also specify a width because by default your content width is 100%. so it should be something like .element {width:400px; float:left} .element {width:400px; float:left}

Hope it helps

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM