...

View Full Version : Why can I not see my border around my header?



s024201
02-08-2012, 11:40 AM
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.

abduraooft
02-08-2012, 11:44 AM
May be, you need to set a border-color.

s024201
02-08-2012, 11:47 AM
I've just put a colour in and it hasnt worked still.

s024201
02-08-2012, 12:28 PM
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.

VIPStephan
02-08-2012, 12:33 PM
Maybe it doesn’t undestand the “thin” keyword? Try it like this:


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.

s024201
02-08-2012, 12:38 PM
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?

abduraooft
02-08-2012, 12:42 PM
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.

s024201
02-08-2012, 12:48 PM
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.


<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.


.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;
}

abduraooft
02-08-2012, 02:32 PM
I get the background color when I test that code at my end.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum