Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Having 2 divs next to each other

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #204608
    mollies
    Participant

    Hi,

    I am having some difficulty trying to get my two text boxes to be next to each other. I have been trying all different things and nothing is working.
    Here is the code http://codepen.io/anon/pen/mJxVQB

    Here is my actual page –
    http://www.lavenderandlovecreative.com/welcome2

    I just want them centered on the page next to each other, like this towards the bottom
    http://www.sprucerd.com/work-with-me/
    (I know there were tables used for that – but that is the overall look I am going for)

    Thanks!

    #204613
    Paulie_D
    Member

    I’m no sure what look you’re actually going for but for centering don’t use floats.

    Use display:inline-block and text-align:center on the parent. You can reset the internal text alignment later.

    I removed the excess padding(?) and there you are.

    http://codepen.io/Paulie-D/pen/eNMzVM

    #204629
    mollies
    Participant

    Thank you! That is what I was looking for.

    Is it possible to have the two paragraphs and blue background be responsive. So that when it is viewed on an iphone or ipad it will shrink down to fit those screen sizes? My whole site does that, but it looks like this won’t when I make the browser smaller.

    Thanks

    #204631
    Paulie_D
    Member

    Well they weren’t responsive because you have them fixed widths and the out div had huge margins.

    I’ve removed the margins, set the internals to be 45% wide (just a number) and they look a little better.

    Other than that you’ll need to use media queries depending on what the actual look is and when the design needs to alter based on viewport width.

    http://codepen.io/Paulie-D/pen/GJxrXp

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.