DIV box driving me crazy

by cotum
4 replies
  • WEB DESIGN
  • |
Hi,

I'd like to have text to the left of this div box:

Catalog of the Universal Mind - Unique Books for Unique Readers - Occult, Seduction, Hypnosis, and more

but doing that seems to be Mission Impossible.

This is driving me insane. Please help.
#box #crazy #div #driving
  • Profile picture of the author 2WDHost
    Hi Cotum.

    You can try to put something like this before your div as a quick solution:
    HTML Code:
    <div style="float:left; width:500px; text-align: left;">Text</div>
    {{ DiscussionBoard.errors[10069129].message }}
  • Profile picture of the author ReneMadmanGlasow
    Like 2WDHost said, this would be the quickest solution, but the whole code is pretty messed up imho.


    I added some code to what 2WDHost posted above, so that you can see the div and the text within.

    HTML Code:
    <div style="float:left; width:500px; height:182px; text-align: left; background-color:lightgrey">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas molestie ornare ante tristique aliquam. Aliquam id condimentum metus, at elementum felis. Curabitur imperdiet enim nec pharetra aliquam. Proin blandit pretium libero, sed faucibus velit feugiat quis. Mauris pellentesque vel justo non egestas. Cras cursus facilisis mi eget lacinia. Vivamus tincidunt turpis auctor tortor lacinia varius. Phasellus fermentum eros vel felis hendrerit imperdiet. Quisque vehicula eleifend tempor. Donec eleifend mi quam, a ullamcorper ex fringilla ut. Nunc tincidunt, leo eget porta imperdiet, odio turpis congue nunc, at egestas massa ligula ut neque.</div>
    You can add this between

    HTML Code:
    </center>
    and

    HTML Code:
    <div align="right">
    in your code.
    {{ DiscussionBoard.errors[10087121].message }}
  • Profile picture of the author Techalo
    Originally Posted by cotum View Post

    Hi,

    I'd like to have text to the left of this div box:

    Catalog of the Universal Mind - Unique Books for Unique Readers - Occult, Seduction, Hypnosis, and more

    but doing that seems to be Mission Impossible.

    This is driving me insane. Please help.
    You should be able to do this fairly easily, but if you're not familiar with CSS and you're updating a template, you can break things, so just make sure you back up your files before making any changes. I assume you want to set it up in a way where the design is responsive, correct? If so, you'll need to define the CSS properties for your text and your div and float them both left (example: <p style="position:relative;float:left;max-width:300px; max-height:200px;">).

    If you don't care about responsiveness, you can also achieve this with an html table too.

    Hope this helps.

    Cheers,
    Will
    {{ DiscussionBoard.errors[10088454].message }}
  • Profile picture of the author csschimp
    if you are using the div with the position absolute then you might be facing the problem
    Or you might be facing problem with the clear div you need to clear div as i had done in the bottom code

    <div style="position:realtive;">
    <div style="position:relative;float:left;"> Your First Div</div>
    <div style="position:relative;float:left;"> Your Second Div</div>
    <div style="clear:both;"></div>
    </div>


    I think this will work and will solve your problem
    {{ DiscussionBoard.errors[10088697].message }}

Trending Topics