homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

Making horizontal boxes

Msg#: 4510047 posted 1:36 am on Oct 20, 2012 (gmt 0)

What is the html code to make horizontal boxes i need to make some boxes go from left to right but all i can find is on top of each other, you can see example here <snip> where the boxes are next to each other, and will this affect the page width on my site.
Someone told me use DIV tags but how do i put this in HTML code?.

[edited by: incrediBILL at 2:59 pm (utc) on Oct 20, 2012]
[edit reason] removed URLs, see forum Charter [webmasterworld.com...] [/edit]



WebmasterWorld Senior Member lucy24 us a WebmasterWorld Top Contributor of All Time Top Contributors Of The Month

Msg#: 4510047 posted 5:33 am on Oct 20, 2012 (gmt 0)

Whoa. You don't need a cut-and-paste answer. You need to go off and learn a bit of CSS. Spend an hour or two at the tutorial of your choice-- most people seem to end up at w3schools in spite of its shortcomings. And then once you've got a general idea of what's going on, bookmark the CSS Index [w3.org].

It souns as if what you're looking at is two side-by-side elements with the display propery "inline-block". But, again, a cut-and-paste answer will do you more harm than good.


WebmasterWorld Senior Member swa66 us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 4510047 posted 9:44 am on Oct 20, 2012 (gmt 0)

You do need to look into CSS and indeed, you need to learn it as Lucy24 says.

To bootstrap you a bit: CSS has a number of way to position things:

  • inline: (and/or inline-block): an element is like a word on a line of text. Put some of these one after the other and they'll act like words on a line, including wrapping when they run out of width, and overflowing if they have to.

  • floating: the old school favorite (old versions of IE have horrible CSS support) is much like an image with the align="left" or align="right" property back in the old days of HTML 3.x: they place themselves to a side and will let the rest of the text flow next to them, pushing text out of the way.

  • relative positioning: rarely used: but you can "nudge" elements in any direction (often this property is used for "side effects" such as triggering features in IE to avoid bugs or to make the element gain "position" (see further)

  • absolution positioning: this puts an element relatative to the closest parent that has gained position.

  • fixed positioning: this puts relative to the viewport (the screen, so it does not scroll with the page.


Msg#: 4510047 posted 4:45 pm on Nov 7, 2012 (gmt 0)

The following 2 messages were cut out to new thread by bill. New thread at: html/4517013.htm [webmasterworld.com]
3:09 pm on Nov 8, 2012 (jst +9)

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved