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 9 of 9
  1. #1
    New Coder
    Join Date
    Feb 2012
    Posts
    11
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Why can I not see my border around my header?

    Last night I posted about putting a curved border. I followed your advice and it worked. Unfortunately for some reason I may not of saved all of my work (stupid error on my part). Now however I cannot see my border. My current code is

    .header{
    width:1000px;
    height:150px;
    background-color:#F5F5F5;
    margin-top:40px;
    border:thin;
    webkit-border-radiis: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;



    } *I've also just realised that my background colour for my header has also dissapeared! This must be part of the same problem.
    Last edited by s024201; 02-08-2012 at 11:50 AM. Reason: missed information.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    May be, you need to set a border-color.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Feb 2012
    Posts
    11
    Thanks
    4
    Thanked 0 Times in 0 Posts
    I've just put a colour in and it hasnt worked still.

  • #4
    New Coder
    Join Date
    Feb 2012
    Posts
    11
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Right. I dont know whether this information will help you guys but here goes. I've added a background colour to the body and this has now highlighted that my header does have a curved border. Therefore the only thing I cannot understand is why the colour i've designated for my header is not working.

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,624
    Thanks
    6
    Thanked 1,001 Times in 974 Posts
    Maybe it doesn’t undestand the “thin” keyword? Try it like this:
    Code:
    border: 1px solid red;
    For further help you need to post your entire HTML and CSS, it’s not possible to give any real advice based on such a small snippet of code. Often an error is caused in a much different place than where it becomes obvious.

  • Users who have thanked VIPStephan for this post:

    s024201 (02-08-2012)

  • #6
    New Coder
    Join Date
    Feb 2012
    Posts
    11
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Yes thats worked, I can see the border now. Thanks very much. Do you have any idea as to why my background colour is not working within the header?

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Do you have any idea as to why my background colour is not working within the header?
    Please post your entire code or better 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)

  • #8
    New Coder
    Join Date
    Feb 2012
    Posts
    11
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Sorry for not being able to show you the page here is the code that I've got however for the header and the divs within it. I appreciate your patience

    html below for my header.

    Code:
    <div class="header">
    
    
    
    <div class="logo"><img src="images/logo_jpg.jpg" width="234" height="125" alt="heart foundation logo"/></div>
    
    <div class="contact"> <script>
    
    /*
    Live Date Script- 
    © Dynamic Drive (www.dynamicdrive.com)
    For full source code, installation instructions, 100's more DHTML scripts, and Terms Of Use,
    visit http://www.dynamicdrive.com
    */
    
    
    var dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
    var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December")
    
    function getthedate(){
    var mydate=new Date()
    var year=mydate.getYear()
    if (year < 1000)
    year+=1900
    var day=mydate.getDay()
    var month=mydate.getMonth()
    var daym=mydate.getDate()
    if (daym<10)
    daym="0"+daym
    var hours=mydate.getHours()
    var minutes=mydate.getMinutes()
    var seconds=mydate.getSeconds()
    var dn="AM"
    if (hours>=12)
    dn="PM"
    if (hours>12){
    hours=hours-12
    }
    if (hours==0)
    hours=12
    if (minutes<=9)
    minutes="0"+minutes
    if (seconds<=9)
    seconds="0"+seconds
    //change font size here
    var cdate="<small><font color='000000' face='Arial'><b>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+" "+hours+":"+minutes+":"+seconds+" "+dn
    +"</b></font></small>"
    if (document.all)
    document.all.clock.innerHTML=cdate
    else if (document.getElementById)
    document.getElementById("clock").innerHTML=cdate
    else
    document.write(cdate)
    }
    if (!document.all&&!document.getElementById)
    getthedate()
    function goforit(){
    if (document.all||document.getElementById)
    setInterval("getthedate()",1000)
    }
    
    </script>
    <span id="clock"></span>  <img src="images/union_jack.jpg" width="40" height="28" alt="union jack" /><br/>
    <span class="bold">Call:0741 390 2851</span></br>
    <a href="#">info@heartfinancialservices.co.uk</a></div>
    
    
    </div>
    css for header which is comprised of an image, live date and contact details below.

    Code:
    .header{
    	width:1000px;
    	height:150px;
    	margin-top:30px;
    	background-color:#F5F5F5;
    	webkit-border-radius: 10px;
    	-moz-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
    border-color:#666666;
    border: 1px solid grey;
    
    }
    
    .logo{
    	width:214px;
    	height:125px;
    	float:left;
    	padding-left:20px;
    	
    }
    
    .contact{
    	float:right;
    	padding-right:10px;
    	padding-top:10px;
    	font-family: Arial, Helvetica, sans-serif;
    	line-height: 24px;
    }
    Last edited by VIPStephan; 02-08-2012 at 01:43 PM. Reason: wrapped code BB tags

  • #9
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    I get the background color when I test that code at my end.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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