1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Help Me Fix This CSS, Please!

Discussion in 'Styling and Customization Questions' started by TheBigK, Jan 7, 2013.

  1. TheBigK

    TheBigK Well-Known Member

    My CSS Code is -

    display: box;
    border: 1px solid #C8C8C8; 
    border-radius: 5px;
    padding: 5px;
    #welcomebox .boxleft {
    width: 600px;
    float: left;
    font: 11pt Verdana;
    #welcomebox .boxright {
    width: 240px;
    and the HTML I'm using is -
    <div id="welcomebox">
    <div class="boxleft">
    Welcome to <b>CrazyEngineers (CE)</b> - Feel free to ask questions / doubts or discuss your ideas with over <b>141,000</b> engineers just like you signed up from 180 countries! Joining is free, why not join today? Joining is completely free and takes less than a minute to complete!
    <div class="boxright">
    <label id="SignupButton" for="LoginControl">
    <a class="inner" href="index.php?login/">Sign Up Now!</a>
    ...and I put this html in the ad_below_top_breadcrumb template. As a result, I got this -

    Screen Shot 2013-01-07 at 7.29.26 PM.png

    Now, I want the sign-up button to be displayed inside the box, well aligned with the text. What am I doing wrong? o_O
  2. Chris D

    Chris D XenForo Developer Staff Member

    Well, firstly, you have an empty "height" property in your CSS.

    Your CSS will be rendering as:

    height: float: left;

    Which is invalid.

    You might also want to consider using percentages as you widths as well. That way it will scale better on multiple screen sizes.
    TheBigK and Shelley like this.
  3. TheBigK

    TheBigK Well-Known Member

    Atta Boy! I added the height property and made the widths in percentages. I've a fixed layout, so it won't break anyway :-D

    Thanks a ton, Chris!

Share This Page