WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Div and alignment (10 posts)

  1. danielwoodhead
    Member
    Posted 1 year ago #

    Not sure if this is just me not understanding not coding correctly, but in anyone can help let me know.

    I have created the following divs in the css file

    #div_split{
    clear.both;
    }
    .sub_lefthalf{
    	width: 50%;
    	float: Left;
    }
    
    .sub_righthalf{
    	width: 50%;
    	float: Right;
    }
    #div_center{
    clear.both;
    }
    .sub_centre{
    	width: 100%;
    	float: center;
    }
    
    #div_3Split{
    clear.both;
    }
    
    .sub_1{
    	width: 30%;
    	float: Left;
    }
    
    .sub_2{
    	width: 30%;
    	float: Center;
    }
    .sub_3{
    	width: 30%;
    	float: Right;
    }
    
    and the following on a wordpress page.
    
    <div id="div_split">
    <div class="sub_lefthalf" style="text-align: center;">
    ...</div>
    <div class="sub_righthalf" style="text-align: center;">
    ...</div>
    </div>
    <div id="div_center">
    <div id="sub_centre" style="text-align: center;">
    ...</div>
    </div>
    <div id="div_3Split">
    <div class="sub_1" style="text-align: center;">
    ...</div>
    <div class="sub_2" style="text-align: center;">
    ...
    </div>
    <div class="sub_3" style="text-align: center;">
    ...</div>
    </div>


    [Please use the code buttons when posting code here.]

    The problem I'm having is that the div_3split is supposed to show 3 columns next to each other, but it shows sub1 ok, then sub 2 is underneath the sub1 and is aligned to the left when it chould be center. Then sub3 is under sub2 ,but this is aligned to the right as if should be.

    If anyone can help me out or point me in the right direction.

  2. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    a css forum might be a better place to ask; for instance http://csscreator.com/forum

  3. danielwoodhead
    Member
    Posted 1 year ago #

    I think the issue is with wordpress as if I put the code into just a html file it works as expected.

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Without a link to a live page where this code is not working, there's no way to help with CSS issues.

    Also, make sure your code is error free:

    http://codex.wordpress.org/Validating_a_Website

  5. danielwoodhead
    Member
    Posted 1 year ago #

  6. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

  7. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    One other thing you should be aware of is that if you make any changes to theme files (i.e. CSS style.css file), those changes will be overwritten when the theme or WP (for default themes like yours) is updated. It's therefore highly recommended that you create a Child Theme or use a custom CSS plugin such as JetPack.

    http://codex.wordpress.org/Child_Themes

  8. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    the issue is basic css - for instance http://www.w3schools.com/css/css_float.asp

    this forum is not the space to teach fundamental knowledge of formatting.

  9. danielwoodhead
    Member
    Posted 1 year ago #

    Thanks for the info guys. Only do css once in a blue moon and can't remember how I did it last time. Will do a bit more reading up.

  10. danielwoodhead
    Member
    Posted 1 year ago #

    Resolved

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags