Jump to content

center a child div within a parent div


MasterACE14

Recommended Posts

I'm trying to center the 'feed_pagelinks' div at the bottom of the 'feed' div. I've got it at the bottom, but it's in the far left corner, I wish to center it and aren't having much luck. Any help is appreciated, thanks!

 

div#feed {
    border: 2px solid #555;
    padding: 4px;
    margin-bottom: 20px;
    text-align: center;
    display: block;
    min-height: 100px;
    position: relative;
}

div#feed_pagelinks {
    margin: auto;
    margin-top: 15px;
    position:absolute;
    bottom: 0;
    margin-bottom: 5px;
}

 

<div id="feed">
{{update_feed}}

{{feed}}

<div id="feed_pagelinks">| {{page_links}} |</div>
</div>

Link to comment
https://forums.phpfreaks.com/topic/248859-center-a-child-div-within-a-parent-div/
Share on other sites

try this.

div#feed {
    border: 2px solid #555;
    padding: 4px;
    margin-bottom: 20px;
    text-align: center;
    display: block;
    min-height: 100px;
    position: relative;
}

div#feed_pagelinks {
    margin:0 auto;
    margin-top: 15px;
    position:absolute;
    bottom: 0;
    margin-bottom: 5px;
}

use this instead. i changed the position from absolute to relative for div#feed_pagelinks

 

<style>
div#feed {
    border: 2px solid #555;
    padding: 4px;
    margin-bottom: 20px;
    text-align: center;
    display: block;
    min-height: 100px;
    position: relative;
}

div#feed_pagelinks {
    margin: auto;
    margin-top: 15px;
    position:relative;
    bottom: 0;
    margin-bottom: 5px;
}

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.