Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts

    Question Div with problem - Div refuses to apply "width: auto". Please help me?

    Hi.

    I'm trying to get a div tag to apply "width: auto", but for some weird reason it doesn't work.

    This is how it looks now:


    And this is how i'd like it to look: (photoshop'd):


    (you can't see the "post-comments-title" because it's too far to the right)


    Here's the HTML code for it: (i included the element above and beneath the element i have problems with)
    Code:
    <h2 class="post-title">
      <a href="#"> some text goes here</a>
    </h2>
    
    <div class="post-comments-title">
      some text goes here
    </div>
    
    <div class="post-meta-top">
      some text goes here
    </div>
    
    <div class="post-content">
      some text goes here
    </div>
    And here's the CSS:
    Code:
    .post-title {
    	padding: 10px 35px 0px 15px;
    	max-width: 560px;
    	font-family: Georgia, Arial, sans-serif;
    	font-size: 26px;
    	font-weight: normal;
    	line-height: 25px;
    	text-decoration: none;
    }
    
    .post-comments-title {
            position: absolute;
    	font-family: Helvetica,Arial,sans-serif;
    	width: 46px;
    	height: 39px;
    	background: transparent url(images/comment-title.png) no-repeat top left;
    	border: none;
    	right: 10px;
    	top: 10px;
    	overflow: hidden;
    	font-size: 18px;
    	font-weight: bold;
    }
    
    .post-meta-top {
    	overflow: hidden;
    	padding: 4px 6px;
    	margin: 0px 15px;
    	color: #8BD2FF;
    	background: #1D303C;
    	border: 1px solid #1C4159;
    	width: auto;
    	color: #88BFE2;
    	display: block;
    }
    
    .post-content {
    	padding: 5px 15px 0px 15px;
    	overflow: hidden;
    	display: block;
    	line-height: 18px;
    	font-size: 12px;
    	font-family: Arial,Helvetica,Sans-Serif;
    }
    The div that wraps around all these elements has the position "relative", just so you know.

    Any help would be extremly appreciated. Thanks in advance!
    Last edited by nikee; 05-23-2009 at 01:38 PM.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Can we have a link to your page?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts
    Quote Originally Posted by abduraooft View Post
    Can we have a link to your page?
    I would post it if i could, but i'm working on it locally. Do u want me to post the whole HTML and CSS code here?

  • #4
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts
    the html:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<title>my title</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    	<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
    </head>
    
    <body>
    <div id="header">
        <div class="header-inner">
        <div class="header-topper">
        <p class="topper-title">Random post:</p>
        <p class="topper-post"><a href="#">random post goes here</a></p>
         	
    	<div class="topper-search">
    		<form method="get" id="searchform" action=""> 
    		<input class="input-search" type="text" value="Search" name="s" id="s" onblur="if (this.value == '') {this.value = 'Search';}" onfocus="if (this.value == 'Search') {this.value = '';}" /> 
    		<input type="hidden" id="searchsubmit" /> 
    		</form>
    	</div> <!-- End topper-search -->
     
        </div> <!-- End header-topper -->
        
        <div class="header-logo-wrapper">
    	<div class="header-logo"><a href=""></a></div>
    	</div>
        	
        <div class="header-menu">
            <ul>
                <li class="page_item"><a href="index.html" title="Home">Home</a></li>
                <li class="page_item"><a href="#" title="Images">Images</a></li> 
            </ul>
        </div> <!-- End header-menu -->
    	
        
    	
    	<div class="header-nfo">
          <div class="breadcrumb">
    	  <p class="breadcrumb-text">
          <a href="http://PlanetTechSupport.com/b" title="Browse to: Home">Home</a> / Blog
    	  </p>
          </div>
    	  
    	  <a href="http://PlanetTechSupport.com/b/?feed=rss2" title="Blog RSS feed" style="float: right;">
    	  <img src="http://PlanetTechSupport.com/b/wp-content/themes/blubbz/images/feed.png" style="float: right; margin-left: 5px; border: none !important;" alt="rss feed" />
    	  </a>
    	  
    	  <div class="header-subscribe">
    	  </div>
      
      
    	</div> <!-- End header-nfo -->
    	
        </div> <!-- End header-inner -->
    </div> <!-- End header -->
    
    
    <div id="content">
    <div class="content-inner"><!-- Index.php -->
        <div class="main-content">
    	  <div class="main-content-item">
    
           <h2 class="post-title"><a href="#">some text goes here</a>
    	   </h2>
    	   
    	   <div class="post-comments-title">
    	   15
    	   </div>
    	   
    	   <div class="post-meta-top">
    	   some text goes here
    	   </div>
           
            <div class="post-content">
    	    some text goes here
    		</div>
    
           </div> <!-- End main-content-item -->
    
    
    </div>
    </div>
    
        </div> <!-- End main-content -->
        
    <div id="footer">
    content content goes here
    </div> <!-- End footer -->
    
    </body>
    </html>
    and the css:
    Code:
    /********************************
    Base...
    ********************************/
    
    body {
    	background: #FFFFFF;
    	color: #353535;
    	font-family: Verdana, Arial, Geneva, sans-serif;
    	font-size: 11px;
    	padding: 0px;
    	margin: 0px;
    }
    
    h1, h2, h3, h4, h5, h6 {
        font-family: Georgia, Arial, sans-serif;
    }
    
    h2 {
        font-size: 16.5px;
    }
    
    *, * a {
    	margin: 0px;
    	padding: 0px;
    	border: 0px;
    }
    
    li {
    	list-style-type: none;
    }
    
    a {
    	color: #205E93;
    	text-decoration: none;
    }
    
    a:hover {
    	color: #649320;
    	text-decoration: none;
    }
    
    ul, ol {
    	margin: 0px;
    	padding: 0px;
    }
    
    img, img a, img a:hover {
    	border: 0px;
    }
    
    input, textarea {
        background: #FFFFFF;
    	border: 1px solid #303030;
    	color: #303030;
    	padding: 3px 7px;
    }
    
    input theckbox {
        border: none !important;
    }
    
    
    
    
    
    
    
    
    /********************************
    Header
    ********************************/
    
    #header {
    	height: auto;
    	overflow: auto;
    	background: url(images/headerbg.png) repeat-x top left;
    }
    
    .header-inner  {
    	height: auto;
    	width: 970px;
    	background: url(images/header.png) no-repeat top left;
    	display: block;
    	overflow: hidden;
    	margin: 0 auto;
    	padding: 0px 15px;
    }
    
    .header-topper {
        height: 30px;
    	margin: 0px;
    	padding: 0px;
    	line-height: 30px;
    	text-transform: uppercase;
    	font-size: 11px;
    	color: #6C767D;
    }
    
    .header-topper p {
        width: auto;
    	float: left;
    }
    
    .topper-title {
        margin-right: 10px;
    }
    
    .topper-title, .topper-title:hover, .topper-title a, .topper-title a:hover {
        border-bottom: none;
    	text-decoration: none;
    }
    
    .topper-title a {
        color: #6C8B9C;
    }
    
    .topper-title:hover, .topper-title a:hover {
        color: #9BA6AE;
    	cursor: pointer;
    }
    
    .topper-post, .topper-post a {
        color: #A1BCD1;
    	cursor: pointer;
    }
    
    .topper-post:hover, .topper-post a:hover {
        color: #C8D9E6;
    }
    
    .topper-search {
        float: right;
    	overflow: hidden;
    	margin-top: 4px;
    }
    
    .header-logo {
        height: 62px;
        width: 495px;
        background: transparent url(images/logo.png) no-repeat top left;
    }
    
    .header-logo-wrapper {
        height: 82px;
        width: 234px;
    	display: block;
    	margin-top: 18px;
    }
    
    .header-logo a {
        height: 62px;
        width: 495px;
    	display: block;
    }
    
    .header-menu {
        clear: both;
    	width: 970px;
    	overflow: hidden;
    	display: block;
    }
    
    .header-menu li {
        float: left;
    	list-style: none;
    	margin-right: 5px;
    	height: 37px;
    	font-size: 13px;
    }
    
    .header-menu li a {
        padding: 11px 15px;
    	display: block;
    	color: #9DBFD8;
    }
    
    .header-menu a:hover {
        color: #D5E7F4;
    	text-decoration: none;
    }
    
    .current_page_item {
    	background: transparent url(images/menu-item.png) repeat-x top left;
    }
    
    .current_page_item  a {
        color: #202020 !important;
    }
    
    .current_page_item a:hover {
        color: #4C4C4C !important;
    }
    
    .input-search {
        background: #202020;
    	border: 1px solid #384A53;
    	color: #8DB6CD;
    	padding: 3px 6px;
    	width: 150px;
    	font-size: 9px;
    	text-transform: uppercase;
    }
    
    
    
    .header-nfo {
        display: block;
    	margin: 10px 0px;
    	text-transform: uppercase;
    }
    
    .breadcrumb {
        width: auto;
    	float: left;
    	overflow: hidden;
    }
    
    .breadcrumb-text {
        width: auto;
    	float: left;
    	overflow: hidden;
    	margin-top: 3px;
    }
    
    .header-subscribe {
        width: auto;
    	float: right;
    	overflow: hidden;
    }
    
    .subscribe-input {
        width: 150px;
    	text-transform: uppercase;
    	font-size: 9px !important;
    	padding: 3px 6px !important;
    }
    
    
    
    
    
    
    
    
    /********************************
    Content
    ********************************/
    
    .main-content {
    	width: 650px;
    	float: left;
    	overflow: hidden;
    	display: block;
    }
    
    #content {
    	height: auto;
    	overflow: auto;
    }
    
    .content-inner {
    	height: auto;
    	width: 970px;
    	display: block;
    	overflow: hidden;
    	margin: 0 auto;
    	padding: 10px 15px;
    	background: #FFFFFF url(images/contentbg.png) repeat-y top center;
    }
    
    .main-content-item {
        margin-bottom: 20px;
    	position: relative;
    	display: block;
    	overflow: hidden;
    }
    
    /*.main-content-item-single {
    	border:  1px solid #DCDDDF;
    	background: #F6F7F8;
    }*/
    
    .post-content {
    	padding: 5px 15px 0px 15px;
    	overflow: hidden;
    	display: block;
    	line-height: 18px;
    	font-size: 12px;
    	font-family: Arial,Helvetica,Sans-Serif;
    }
    
    .post-content li {
        list-style-position: inside;
    	list-style-image: url(images/bullet.gif);
    }
    
    .post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 {
        margin: 7px 0px;
    }
    
    .h3 {
        font-size: 18px;
    }
    
    .post-content p {
        margin-bottom: 12px;
    }
    
    .wp-smiley {
        margin: 0px !important;
    	padding: 0px !important;
    	outline: 0px !important;
    	border: 0px !important;
    }
    
    
    .post-content img {
        padding: 5px;
    	background: #FFFFFF;
    	border: 1px solid #DCDDDF;
    	max-width: 615px;
    }
    
    .post-title {
    	padding: 10px 35px 0px 15px;
    	max-width: 560px;
    	font-family: Georgia, Arial, sans-serif;
    	font-size: 26px;
    	font-weight: normal;
    	line-height: 25px;
    	text-decoration: none;
    }
    
    .post-comments-title {
        position: absolute;
    	font-family: Helvetica,Arial,sans-serif;
    	width: 46px;
    	height: 39px;
    	background: transparent url(images/comment-title.png) no-repeat top left;
    	border: none;
    	right: 10px;
    	top: 10px;
    	overflow: hidden;
    	font-size: 18px;
    	font-weight: bold;
    }
    
    .post-comments-title a {
        color: #FFFFFF;
    	line-height: 35px;
    }
    
    .social-links {
        margin-top: 7px;
    	padding: 0px;
    	clear: both;
    	overflow: hidden;
    	display: block;
    	font-weight: bold;
    }
    
    .social-links a {
        text-decoration: underline !important;
    	color: #333333 !important;
    }
    
    .social-links a:hover {
        text-decoration: none !important;
    	color: #444444 !important;
    }
    
    li.i_digg {
        background:url(images/i_digg.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    	margin-right: 10px;
    }
    
    li.i_stumb {
        background:url(images/i_stumb.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    	margin-right: 10px;
    }
    
    li.i_del {
        background:url(images/i_del.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    	margin-right: 10px;
    }
    
    li.i_reddit {
        background:url(images/i_reddit.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    	margin-right: 10px;
    }
    
    li.i_technorati {
        background:url(images/i_technorati.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    	margin-right: 10px;
    }
    
    li.i_print {
        background:url(http://planettechsupport.com/b/wp-content/themes/print.gif) no-repeat;
    	padding-left: 20px;
    	float: left;
    }
    
    .post-meta-top {
    	overflow: hidden;
    	padding: 4px 6px;
    	margin: 0px 15px;
    	color: #8BD2FF;
    	background: #1A4970;
    	border: 1px solid #1C4159;
    	width: auto;
    	color: #FFFFFF;
    	display: block;
    }
    
    .post-meta {
    	padding: 10px 0px;
    	margin: 0px 15px;
    	border-top: 1px solid #DFE3E6;
    	border-bottom: 1px solid #DFE3E6;
    	color: #2C83BB;
    	overflow: hidden;
    	display: block;
    }
    
    .post-meta-page {
    	padding: 10px 15px 15px;
    	height: 1px;
    	display: block;
    }
    
    .post-meta a {
        color: #000000;
    	text-decoration: none;
    	border-bottom: 1px dotted black;
    }
    
    .post-meta a:hover {
    	color: #1E4965;
    	text-decoration: none;
    }
    
    .post-title a {
    	color: #202020;
    	width: auto;
    }
    
    .post-title a:hover {
    	color: #5E5E5E;
    	text-decoration: underline;
    }
    
    .post-ratings {
        margin-top: 5px;
    }
    
    
    
    
    
    /********************************
    Sidebar
    ********************************/
    
    #sidebar h2 {
        font-family: Georgia, Arial, sans-serif;
    	font-size: 16.5px;
    	font-weight: bold;
    }
    
    #sidebar {
        width: 300px;
    	float: right;
    	overflow: hidden;
    	display: block;
    }
    
    #sidebar ul li {
        background: #F6F7F8;
    	border: 1px solid #DCDDDF;
    	padding: 10px;
    	margin-bottom: 10px;
    	display: block;
    	overflow: hidden;
    }
    
    #sidebar ul li ul {
        background: #FEFEFE;
    	border: 1px solid #DCDDDF;
    	margin: 5px 0px 0px 0px;
    	padding: 5px;
    }
    
    #sidebar ul li ul li {
        padding: 2px 0px 5px 0px;
    	margin: 5px 0px;
    	border-top: none;
    	border-left: none;
    	border-right: none;
    	border-bottom: 1px dashed #DCDDDF;
    	background: transparent;
        list-style-position: inside;
    	list-style-image: url(images/bullet.gif);
    }
    
    
    
    .recent-comments ul li span, .recent-comments ul li span a {
        color: #202020 !important;
    	text-transform: uppercase;
    }
    
    
    
    ul.idTabs {
        padding: 10px;
    	margin: 10px 0px;
    	display: block;
    	overflow: hidden;
    	clear: both;
    	background: #F6F7F8 !important;
    	border: 1px solid #DCDDDF !important;
    	-webkit-border-top-right-radius: 20px;
    	-moz-border-radius-topright: 20px;
    	-webkit-border-bottom-left-radius: 20px;
    	-moz-border-radius-bottomleft: 20px;
    }
    
    .idTabs li {
        padding: 5px !important;
    	background: #FFFFFF !important;
    	border: 1px solid #DCDDDF !important;
    	min-width: 50px !important;
    	text-align: center;
    	display: block !important;
    	overflow: hidden !important;
    	float: left;
    	margin-right: 10px;
    	font-size: 12px;
    }
    
    .idTabs-content {
    	background: #FFFFFF;
    	border: 1px solid #DCDDDF;
    	padding: 5px;
    	clear: both;
    	overflow: hidden;
    }
    
    .idTabs a {
        text-decoration: none;
    }
    
    .idTabs .selected {
        font-weight: bold;
    }
    
    .idTabs-content ul {
    	background: transparent !important;
    	border: 0px !important;
    	overflow: hidden;
    }
    
    .idTabs-content li {
    	list-style-type: none !important;
    	float: left !important;
    	clear: both;
    	padding: 0px 0px 0px 15px !important;
    	margin: 3px 0px !important;
    	background: transparent url(images/bullet.gif) no-repeat center left !important;
    	border: 0px !important;
    	text-align: left !important;
    	width: auto !important;
    }
    
    
    
    
    
    /********************************
    Comments
    ********************************/
    #comments-form {
        padding: 0px 10px;
    	overflow: hidden;
    }
    
    #comments li {
        margin-top: 15px;
    	padding: 10px 15px;
    	border: 1px solid #EAEAEA;
    	min-height: 50px;
    }
    
    
    
    
    
    
    
    
    
    
    
    /********************************
    Home page
    ********************************/
    
    .home-about {
       display: block;
       overflow: hidden;
       margin-bottom: 10px;
       padding-bottom: 10px;
       border-bottom: 1px solid #DCDDDF;
    }
    
    .home-contbox {
        width: 277px;
    	min-height: 50px;
    	padding: 10px;
    	display: block;
    	float: left;
    	overflow: hidden;
    	background: #FFFFFF;
    	border: 1px solid #DCDDDF;
    	margin-right: 15px;
    	-webkit-border-top-right-radius: 20px;
    	-moz-border-radius-topright: 20px;
    	-webkit-border-bottom-left-radius: 20px;
    	-moz-border-radius-bottomleft: 20px;
    }
    
    .home-contbox ul {
        padding-top: 5px;
    	padding-left: 2px;
    	padding-right: 2px;
    	padding-bottom: 5px;
    }
    
    .home-contbox li {
        padding: 2px 0px 5px 0px;
    	margin: 5px 0px;
    	list-style: none;
    	border-top: none;
    	border-left: none;
    	border-right: none;
    	border-bottom: 1px dashed #DCDDDF;
    	background: transparent;
    }
    
    .home-random-img {
        padding-top: 15px;
    	clear: both;
    	overflow: hidden;
    	display: block;
    }
    
    .home-random-img h2 {
        margin-bottom: 10px;
    }
    
    
    
    
    
    
    
    
    
    /********************************
    Image Randomizer
    ********************************/
    
    .randomizer {
    	height: 347px;
    	border: 2px solid #333333;
    	margin-bottom: 10px;
    	background: #FFFFFF;
    }
    
    .random-img {
    	max-height: 335px;
    	padding: 0px !important;
    	max-width: 614px;
    	border: none !important;
    	outline: none !important;
    }
    
    .full-url-wrapper {
        margin: 15px 0px;
    }
    
    .full-url {
        width: 400px;
    }
    
    .prev-img, .next-img {
    	width: auto;
    	padding-top: 5px;
    	padding-bottom: 5px;
    	background: #F88733;
    	float: left;
    	clear: none;
    	overflow: hidden;
    	display: block;
    	border: 1px solid #A67753;
    }
    
    .prev-img {
    	float: left;
    }
    
    .next-img {
    	float: right;
    }
    
    .prev-img a, .next-img a {
    	color: #222222;
    	text-decoration: none !important;
    	padding-left: 15px;
    	padding-right: 15px;
    }
    
    .prev-img a:hover, .next-img a:hover {
    	color: #414141;
    	text-decoration: none !important;
    }
    
    .img-amount {
    	width: 190px;
    	padding: 5px 15px;
    	background: #F88733;
    	text-align: center;
    	overflow: hidden;
    	display: block;
    	border: 1px solid #A67753;
    	color: #452106;
    }
    
    .img-box {
    	height: auto;
    	margin: 15px 0px;
    	overflow: hidden;
    	clear: both;
    }
    
    .img-box-item {
    	width: 187px !important;
    	height: 120px;
    	border: 1px solid #333333;
    	margin-right: 10px;
    	float: left;
    	overflow: hidden;
    }
    
    .img-box-item-link {
    	width: 190px !important;
    	height: 120px !important;
    	display: block;
    }
    
    .img-box-item-img {
    	max-width: 190px;
    	padding: 0px !important;
    	border: none !important;
    }
    
    
    
    
    
    
    /********************************
    Footer
    ********************************/
    
    #footer {
    	min-height: 100px;
    	overflow: hidden;
    	background: #000000;
    	padding: 0px;
    	margin: 0px;
    }
    
    .footer-top {
    	background: #000000;
    	height: auto;
    	overflow: hidden;
    	clear: both;
    }
    
    .footer-top-inner {
        margin: 0px auto;
    	width: 970px;
    	height: auto;
    	overflow: hidden;
    	background: transparent url(images/quotes.png) no-repeat center left;
    }
    
    
    
    
    
    .footer-middle {
    	background: #132F41 url(images/footer-mid-bg.png) no-repeat bottom center;
    	height: auto;
    	overflow: hidden;
    	clear: both;
    	border-top: 1px solid #1C3C51;
    }
    
    .footer-middle-inner {
        margin: 0px auto;
    	min-height: 100px;
    	width: 970px;
    	height: auto;
    	overflow: hidden;
    	padding: 10px 0px;
    }
    
    
    
    
    
    .footer-btm {
    	background: #446479;
    	border-top: 1px solid #668AA1;
    	height: auto;
    	overflow: hidden;
    	clear: both;
    }
    
    .footer-btm-inner {
        margin: 0px auto;
    	min-height: 50px;
    	width: 970px;
    	height: auto;
    	overflow: hidden;
    	padding-top: 10px;
    	padding-bottom: 10px;
    }
    
    
    
    
    
    .random-quote {
    	margin: 10px 0px;
    	padding-left: 75px;
    	font-size: 15px;
    	font-family: Arial, helvetica, verdana;
    	text-transform: uppercase;
    	color: #A1BCD1;
    	font-weight: bold;
    	width: 970px;
    }
    
    .footer-middle-inner-box {
        width: 30%;
    	background: transparent url(images/footer-li-border.png) no-repeat center right;
    	min-height: 100px;
    	float: left;
    	overflow: hidden;
    	display: block;
    	padding: 10px;
    	color: #506B7D;
    }
    
    .footer-middle-inner-box a {
    	color: #506B7D;
    }
    
    .footer-middle-inner-box h2 {
        color: #6D8FA4;
    	background: transparent url(images/footer-li.png) no-repeat center left;
    	padding-left: 17px;
    	margin-bottom: 5px;
    }
    
    .footer-middle-inner-box ul {
        
    }
    
    .footer-middle-inner-box ul li {
        float: left;
    	list-style-image: url(images/square.png);
    	list-style-position: inside;
    	width: 100%;
    	color: #506B7D;
    	padding: 5px;
    }
    
    .footer-middle-inner-box ul li a {
    	color: #92ACBD;
    	padding: 5px;
    }
    
    .footer-middle-inner-box ul li a:hover {
    	color: #000000;
    	background: #294A5F;
    	border: 1px dashed #305268;
    	outline: 1px dashed #305268;
    }
    
    .copyright-line {
    	margin-bottom: 10px;
    	text-align: center;
    	color: #0C2636;
    }
    
    .copyright-line a {
        text-decoration: none;
    	color: #000000;
    }
    
    .copyright-line a:hover {
        text-decoration: none;
    	color: #0C2636;
    }
    
    
    
    
    
    
    
    
    
    /********************************
    Page Numbers
    ********************************/
    
    #wp_page_numbers ul, #wp_page_numbers li, #wp_page_numbers a {
    	padding: 0;
    	margin: 0;
    	border: none;
    	text-decoration: none;
    	list-style: none;
    	text-indent: 0px;
    	text-align: left;
    	line-height: 12px;
    	font-family: Verdana;
    }
    
    #wp_page_numbers {
    	margin-top: 15px;
    	padding: 5px;
    }
    #wp_page_numbers ul {
    	width: 100%;
    }
    #wp_page_numbers li {
    	float: left;
    	display: block;
    }
    
    #wp_page_numbers a {
    	margin-top: 2px;
    	margin-bottom: 2px;
    	padding: 5px;
    	margin-left: 1px;
    	margin-right: 1px;
    	display: block;
    	color: #000000;
    	background: #ECECEC;
    }
    
    #wp_page_numbers li a:hover {
    	color: #F0F0F0;
    	background: #323232;
    }
    
    #wp_page_numbers li.space {
    	margin-top: 2px;
    	margin-bottom: 2px;
    	padding-top: 2px;
    }
    
    #wp_page_numbers li.first_last_page {
    	
    }
    
    #wp_page_numbers li.active_page a, #wp_page_numbers li.active_page a:hover  {
        background: #ECECEC;
    	border-bottom: 1px solid #BBBBBB;
    }
    
    #wp_page_numbers li.active_page a {
    	padding: 5px;
    	color: #2A2A2A;
    }
    #wp_page_numbers li.active_page a:hover  {
    	color: black; /* IE fix */
    }
    
    #wp_page_numbers li.page_info {
    	padding: 5px;
    	line-height: 15px;
    	color: #404040;
    }
    Last edited by nikee; 05-23-2009 at 02:25 PM.

  • #5
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Try
    Code:
    .post-meta-top {
    	overflow: hidden;
    	padding: 4px 6px;
    	margin: 0px 15px;
    	color: #8BD2FF;
    	background: #1D303C;
    	border: 1px solid #1C4159;
    	width: auto;
    	color: #88BFE2;
    	float:left;
    }
    .post-content {
            clear:left;
    	padding: 5px 15px 0px 15px;
    	overflow: hidden;
    	display: block;
    	line-height: 18px;
    	font-size: 12px;
    	font-family: Arial,Helvetica,Sans-Serif;
    }
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    nikee (05-23-2009)

  • #6
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts
    Thanks a lot It works perfectly now!

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Umm.. btw I'd recommend you to avoid the use of overflow:hidden; from your elements, unless you really need to hide something.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #8
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts
    Quote Originally Posted by abduraooft View Post
    Umm.. btw I'd recommend you to avoid the use of overflow:hidden; from your elements, unless you really need to hide something.
    Thanks, but why? If everything goes right, nothing should get overflowed? Right?

    I need to use it on elements that wraps around floating elements, otherwise the wrapper wont expand (the height), if you know what i mean :P
    Last edited by nikee; 05-23-2009 at 05:46 PM.

  • #9
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Quote Originally Posted by nikee View Post
    Thanks, but why? If everything goes right, nothing should get overflowed? Right?
    Yeah, but you may not notice if something is wrong with your code, and it may ruin your layout(in some browsers) at a later time(when you make some other adjustments)
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #10
    Regular Coder
    Join Date
    Jan 2009
    Posts
    173
    Thanks
    5
    Thanked 12 Times in 11 Posts
    That's true. Thnx for the tip.


  •  

    Tags for this Thread

    Posting Permissions

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