CODEWITHSUNDEEP
csshtmlformattingwidth
darklitben
darklitben

Reputation: 3

How can I get my div to be less wide, while also being moved to the right?

I have a "Contact" section on my website, and I have a form section and a contact info section as two separate divs. The form acts just fine, but for some reason I can't get the contact info section to simultaneously stay on the right side while becoming less wide. I have an image so you can understand what the issue is: https://i.sstatic.net/I5hot.png I want them to be aligned horizontally next to each other. Thank you!

Upvotes: 0

Views: 157

Answers (3)

ValleyDigital
ValleyDigital

Reputation: 1470

Assuming your form is correct since I can't see your code, you can edit the css.

#form{
width: 500px; /*fill in the width and height*/
height: 500px;
float: left;
}

 #contact{
    width: 500px; /*fill in the width and height*/
    height: 500px;
    float: left;
    }

by default divs are as wide as they can be unless specified and a block element, so your #form is taking up the entire width space. Here is an example fiddle of what I think you're trying to achieve.

http://jsfiddle.net/valleydigital/j3qpeaym/

Upvotes: 1

KevinPB
KevinPB

Reputation: 57

Increase the size of the div in which u place the form div and contact div. Also give style with float left property.

    <style>
    #form #contact
    {
           float:left;
    }
    </style>

Upvotes: 0

tingytong
tingytong

Reputation: 67

I think the solution is to apply a float:left to both your form and your contact info section. This way both of these will sit next to each other horizontally. Floats have normally been used to allow text to flow around an image, but sometimes they can be used to position items as well.

Check this out for some information and there are more informative links at the end of the floats post: http://codemecrazy.wordpress.com/

Upvotes: 0

Related Questions