• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Liutauras Vilda
  • Tim Cooke
  • Jeanne Boyarsky
  • Bear Bibeault
Sheriffs:
  • Knute Snortum
  • paul wheaton
  • Devaka Cooray
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Ron McLeod
  • Piet Souris
  • Ganesh Patekar
Bartenders:
  • Tim Holloway
  • Carey Brown
  • salvin francis

problems with two divs sitting next to the other.

 
Ranch Hand
Posts: 421
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I am having a problem with divs sitting side by side. If you launch this page, you will see a black rectangle with the name Description on it and it is sitting next to a blue box. The blue box and the black rectangle do not have any space between them despite all my efforts.

I have to use the marquee, so I cannot use relative or absolute position nor can I float the black rectangle right.

Thanks,
Michele

 
Marshal
Posts: 67279
170
Mac Mac OS X IntelliJ IDE jQuery Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
A couple of things to get out of the way:
  • As pointed out in the other post, you do not need to use non-standard marquee; you can achieve the same effect (and likely much more smoothly) with script. (jQuery animation makes it easy. See chapter 5 of jQuery in Action (2nd Ed) if you have it.)
  • The font tag is deprecated. Use CSS for styles.
  • You're using HTML comment delimiters to comment out CSS. That's not valid.
  • Why does the use of marquee preclude using float?


  • The way I would approach this is to:
  • Ditch the non-standard and deprecated markup. No <marquee>. No <font>. No <i>.
  • Use jQuery animation instead of marquee.
  • Float the left column.
  •  
    Michele Smith
    Ranch Hand
    Posts: 421
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Good advice, thanks.

    I wonder, where would I find this animated vertical scroller? I have been searching and cannot find anything other than kinda of what I am dealing with.

    Any suggestions appreciated.

    Many Thanks,
    Michele
     
    Bear Bibeault
    Marshal
    Posts: 67279
    170
    Mac Mac OS X IntelliJ IDE jQuery Java
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Here's a fiddle that demonstrates one easy technique I use to get side by side divs.
     
    Bear Bibeault
    Marshal
    Posts: 67279
    170
    Mac Mac OS X IntelliJ IDE jQuery Java
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator

    Michele Smith wrote:I wonder, where would I find this animated vertical scroller? I have been searching and cannot find anything other than kinda of what I am dealing with.


    It's almost trivially easy with the jQuery .animate() method. Simply manipulate the top value.
     
    Greenhorn
    Posts: 5
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    You should change your code as suggested by Bear Bibeault. But if you still do not want to change the code and want to achieve the same behavior, then apply the style "margin-left" to "content2" div. The value will be greater 25%, as your "menu" div has 25% width.

    One more example of side by side div: http://jsfiddle.net/wgmjX/
     
    Michele Smith
    Ranch Hand
    Posts: 421
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Thanks for the fiddle, I liked it a lot.

    thanks again,
    Michele
     
    Bear Bibeault
    Marshal
    Posts: 67279
    170
    Mac Mac OS X IntelliJ IDE jQuery Java
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Michele Smith, your post was moved to a new topic. I figured the scrolling discussion deserved its own topic separate form the layout discussion.
     
    Michele Smith
    Ranch Hand
    Posts: 421
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Hello, I am experiencing difficulty with the div titled content

    What happens is it does not line up appropriately when dynamically populating the div. The first div in the recordset populates this area fine but the others are not lining up appropriately.

    When I try the below referenced absolute tag, the area populates just fine however, the second and third, to the zzzz of the recordset does not look good at all.

    I would like to try to avoid using the absolute tag altogether.

    Below is my code, sorry for the spaces,

     
    grapes are vegan food pellets. Eat this tiny ad:
    Enterprise-grade Excel API for Java
    https://products.aspose.com/cells/java
    • Post Reply Bookmark Topic Watch Topic
    • New Topic
    Boost this thread!