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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts

    adding padding removes rounded corners

    I am having a content area with a background image, in that i added border-radius:20px and then tried to pad-left about 25 px but it romoves the rounded corners. What can i do?

    Code:
    #content{
    height: 650px;
    margin: auto auto;
    width: 957px;
    background: url(img.png) top center no-repeat;
    color:#fcfcfc;
    border-radius: 20px;
    }
    div#content{
    padding-top: 20px;
    padding-left: 20px;
    
    }

  • #2
    New Coder
    Join Date
    Sep 2012
    Posts
    22
    Thanks
    0
    Thanked 6 Times in 6 Posts
    can you please paste html code also?

  • Users who have thanked shyagrawal for this post:

    prateek88 (10-08-2012)

  • #3
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Sure, here it is


    Code:
    <!DOCTYPE html>
    <html lang="en" >
        <head>
            <meta charset="utf-8" />
            <title>Welcome</title>
            <link href="styles/layout.css" rel="stylesheet" type="text/css" />
            <link href="styles/menu.css" rel="stylesheet" type="text/css" />
        </head>
        <body>
            <header>
                <h2>XpertCareers</h2>
                
            </header>
           <div class="container">
    
                <ul id="nav">
                    <li><a href="#">Home</a></li>
                    <li><a class="hsubs" href="#">Menu 1</a>
                        <ul class="subs">
                            <li><a href="#">Submenu 1</a></li>
                            <li><a href="#">Submenu 2</a></li>
                            <li><a href="#">Submenu 3</a></li>
                            <li><a href="#">Submenu 4</a></li>
                            <li><a href="#">Submenu 5</a></li>
                        </ul>
                    </li>
                    <li><a class="hsubs" href="#">Menu 2</a>
                        <ul class="subs">
                            <li><a href="#">Submenu 2-1</a></li>
                            <li><a href="#">Submenu 2-2</a></li>
                            <li><a href="#">Submenu 2-3</a></li>
                            <li><a href="#">Submenu 2-4</a></li>
                            <li><a href="#">Submenu 2-5</a></li>
                            <li><a href="#">Submenu 2-6</a></li>
                            <li><a href="#">Submenu 2-7</a></li>
                            <li><a href="#">Submenu 2-8</a></li>
                        </ul>
                    </li>
                    <li><a class="hsubs" href="#">Menu 3</a>
                        <ul class="subs">
                            <li><a href="#">Submenu 3-1</a></li>
                            <li><a href="#">Submenu 3-2</a></li>
                            <li><a href="#">Submenu 3-3</a></li>
                            <li><a href="#">Submenu 3-4</a></li>
                            <li><a href="#">Submenu 3-5</a></li>
                        </ul>
                    </li>
                    <li><a href="#">Menu 4</a></li>
                    <li><a href="#">Menu 5</a></li>
                    <li><a href="#">Menu 6</a></li>
                    <li><a href="Login.html">Login</a></li>
                    <div id="lunar"></div>
                </ul>
    			</br>
    			
            </div>
    		
    		<div id="content">
    			
    			hello world hello worldhello worldhello worldhello </br>
    			hello world hello worldhello worldhello worldhello </br>
    			hello world hello worldhello worldhello worldhello </br>
    			hello world hello worldhello worldhello worldhello </br>
    			
    		</div>
    		
    		
    		
    		<footer>
    	        <h2>&copy; 2012 <i>TechGeeks<i> |</h2> <a class="tzine">Design by TechGeeks Team
            </footer>
        </body>
    </html>

  • #4
    New Coder
    Join Date
    Sep 2012
    Posts
    22
    Thanks
    0
    Thanked 6 Times in 6 Posts
    Thanks. Please attach image file also.

  • #5
    New to the CF scene
    Join Date
    Aug 2012
    Location
    INDIA
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts
    this worked for me

    Code:
    div#content #maincontent{
    padding-top: 20px;
    padding-left: 20px;
    
    }
    added a div tag with maincontent id inside body but still the bottom curves are not visible



  •  

    Posting Permissions

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