SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Afrika
    Join Date
    Jul 2004
    Location
    Nigeria
    Posts
    1,737
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    3 table alignment does not work properly ???

    Hello guys,
    I have a nested div within a popup div. But have a few issues with it.

    1. The sub div inherits the properties of the parent, which I don't want.

    2. The 3 layer divs do not align properly. See image

    3divs.png

    3. Also when I restore the window size, its all out of order.

    The 1st and container divs with the blue and red curved top borders are inherited from the parent div, which is wrong

    Here is my code
    Please advise

    many thanks

    Ehi


    Code:
    body {
    	margin: 0;
    	padding: 0;
    }
    .container_Navigation {
        border: medium solid #FF6600;
        min-width: 500px;
        background-color: #000000;
    }
    
    .HomePage_Navigation_GetStarted_left {
        border-style: solid;
        border-color: #003399;
        float: left;
        width: 30%;
        border:none;
    }
    
    .HomePage_Navigation_GetStarted_right {
        padding: 0px;
        border-style: dotted;
        border-color: #00CC00;
        float: right;
        width: 30%;
        top: 0px;
        clip: rect(0px, auto, auto, auto);
        vertical-align: top;
    }
    
    .HomePage_Navigation_GetStarted_center {
        border-style: outset;
        border-color: #993300;
        margin-right: 33%;
        margin-left: 32%;
    }

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,511
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)
    afrika, as you know, css and html work together. CSS alone without the HTML does not reveal the cause of your issues. It would be best if you could post a link so we could see the full page. If that is not possible, then post the HTML and CSS in code boxes in you message.

    Your title talks about a table, but the context talks about divs and a "popup" div. I don't know what a "popup" div is.

    It sounds like you might be having a big problem with inheritance. You might want to read about the role that inheritance plays in the application of css properties.

    http://reference.sitepoint.com/css/inheritancecascade

    Best of luck.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Make sure the html for ".HomePage_Navigation_GetStarted_center" div follows the html for the two other floated columns because floats must come before any static content if you want the static content to rise up. It looks to me as though you have arranged the html as left (float), middle (static), right (float) when it should be; left (float), right (float), middle (static).

    But as Ron said we are just guessing until we see the actual html.

    The 1st and container divs with the blue and red curved top borders are inherited from the parent div, which is wrong
    Borders are not inherited which means that you must have rules in place that are applying them.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •