|
HTML - Border Around Each Page Of My Site
Hi, i was wondering if anyone could take a look at my website and tell me why there's a border around each page. My url is www.marksbodyshop.org I will post my html, main.css , defult.css and defult2.css. I tried adding padding:0; and border:0; to the html, body element of the each css but that didn't work. It only happens in ie. Thank you very very much.
Main.css: Code: html,body {
height:100%;
margin:0;
background-color:#000;
background-image:url(../images/firstpage.gif);
background-size:100% 100%;
background-repeat:no-repeat;
overflow:hidden;
border:0;
padding:0;
}
#container {
height:73%;
}
#nav {
position:absolute;
padding:0;
margin:0;
list-style-type:none;
height:7%;
width:57%;
top:40%;
left:20%;
z-index:1;
}
#nav li {
width:16%;
margin:1%;
height:100%;
}
#nav a {
display:block;
width:100%;
height:100%;
outline:none;
text-indent:-9999px;
background-size:100% 300%;
}
#about {background-image:url(../images/aboutus.png);}
#about1 {background-image:url(../images/contactus.png);}
#about2 {background-image:url(../images/freelunch.png);}
#about3 {background-image:url(../images/map.png);}
#about4 {background-image:url(../images/meettheteambutton.png);}
#nav a:hover {background-position:0 -100%;}
#nav a:active {background-position:0 -200%;}
Defult2.css: Code: @charset "utf-8";
/* CSS Document */
body {
margin:0; padding:0;
background:#000000;
}
html, body, #bg {
height:100%;
width:100%;
overflow:hidden;
border:0;
padding:0;
}
#bg {
/*position:absolute; */
left:0;
right:0;
bottom:0;
top:0;
overflow:hidden;
z-index:0;
}
#mainimg {
width:100%;
height:100%;
}
#content {
z-index:1;
/*position:relative;*/
height:100%;
width:100%;
z-index:1;
margin:0 auto;
}
#position{
position:absolute;
top:40%;
left:18%;
width:20%;
z-index:2;
}
/*#position1{
position:absolute;
top:90%;
left:66.38%;
width:30%;
margin: 0 auto;
padding:0px;
z-index: 1;
}*/
#position1 {
left: 66.85%;
padding: 0;
position: absolute;
top: 69%;
width: 20%;
z-index: 1;
height:10%;
}
#nav {
margin:0px;
padding:0px;
height:44px;
}
#nav ul{
margin:0px;
padding:0px;
}
#nav li {
padding:0px;
list-style:none;
margin:5px 0;
/*height:100%;*/
height:100%;
}
#nav a {
display:block;
width:100%;
height:100%;
/*outline:none;
*/
text-indent:-9999px;
background-position:left;
}
#homelink {
left: 0;
padding: 0;
position: absolute;
top: 0;
width: 0;
z-index: 1;
overflow:hidden;
height:100%;
width:100%;
}
#home {width:63.5%;height:43px;background:url(../images/homebutton.png);}
#about {width:49%;height:33px;background:url(../images/aboutus_new.png)}
#about1 {background:url(../images/contactus.png) no-repeat;}
#about2 {background:url(../images/freelunch.png) no-repeat;}
#about3 {background:url(../images/map.png) no-repeat;}
#about4 {background:url(../images/meettheteambutton.png) no-repeat;}
#meettheteam1 {background:url(../images/carlosbutton.png) no-repeat;}
#meettheteam2{background:url(../images/brettbutton.png) no-repeat;}
#meettheteam3 {background:url(../images/marktbutton.png) no-repeat;}
#meettheteam4 {background:url(../images/marksbutton.png) no-repeat;}
#nav a:hover {background-position:0 -0% }
#nav a:active {background-position:0 -0% }
Defult.css: Code: @charset "utf-8";
/* CSS Document */
body {
margin:0; padding:0;
background:#000000;
}
html, body, #bg {
height:100%;
width:100%;
overflow:hidden;
border:0;
padding:0;
}
#bg {
position:absolute;
left:0;
right:0;
bottom:0;
top:0;
overflow:hidden;
z-index:0;
}
#bg img {
width:100%;
height:100%;
}
#content {
z-index:1;
/*position:relative;*/
height:100%;
width:100%;
z-index:1;
margin:0 auto;
}
#position{
position:absolute;
top:40%;
left:18%;
width:20%;
z-index:2;
}
/*#position1{
position:absolute;
top:90%;
left:66.38%;
width:30%;
margin: 0 auto;
padding:0px;
z-index: 1;
}*/
#position1 {
left: 66.85%;
padding: 0;
position: absolute;
top: 71%;
width: 20%;
z-index: 1;
height:10%;
}
#nav {
margin:0px;
padding:0px;
height:44px;
}
#nav ul{
margin:0px;
padding:0px;
}
#nav li {
padding:0px;
list-style:none;
margin:5px 0;
/*height:100%;
height:100%;*/
}
#nav a {
display:block;
/*width:100%;
height:100%;
outline:none;
*/
text-indent:-9999px;
background-position:left;
}
#homelink {
left: 0;
padding: 0;
position: absolute;
top: 0;
width: 0;
z-index: 1;
overflow:hidden;
height:100%;
width:100%;
}
#home {background:url(../images/homebutton.png) no-repeat;}
#about {background:url(../images/sm/download.png) no-repeat;}
#about1 {background:url(../images/sm/download.png) no-repeat;}
#about2 {background:url(../images/sm/email.png) no-repeat;}
#about3 {background:url(../images/sm/download.png) no-repeat;}
#about4 {background:url(../images/sm/email.png) no-repeat;}
#meettheteam1 {background:url(../images/carlosbutton.png) no-repeat;}
#meettheteam2{background:url(../images/brettbutton.png) no-repeat;}
#meettheteam3 {background:url(../images/marktbutton.png) no-repeat;}
#meettheteam4 {background:url(../images/marksbutton.png) no-repeat;}
#nav a:hover {background-position:0 -0% }
#nav a:active {background-position:0 -0% }
Similar TutorialsHi, I have been making this web site for some one using the lates version of dreamweaver. http://www.thewayoflife.co.uk/index2.htm As you can see around the whole of the site is a light blue border. The background colour of the page is set to that blue colour. I have been using the layout tables (Green and blue buttons in the layout tab) to lay out the page. However I notice to you cannot drag the table right to the edge of the page and in which case you can see the background colour alll around the sides of the page. I was wondering if you had any idea on how to get rid of this, so i could take the dark blue side bar right to the side? Regards, Glenn Hi All, I am building a website for a friend. The site is built in Dreamweaver CS2. I need to have the top part of the background in black and the bottom part of the background in white. I have done this so far with a table, 100% width, background black. But when I view it in IE or Firefox, the background has a white border around it, rather than coming right to the edge of the screen. You can see what I mean he Test Site Any help is much appreciated. Ok, I've written my entire site in tables and that works lovely. I now want to put a border around everything on my page. So I tried: <table width="820" cellspacing="0" cellpadding="10" border="1" bordercolor="#c51e21"> <tr> <td> <div align="center"> MY ENTIRE WEBPAGE </div> </td> </tr> </table> However, the border color doesn't change and just fades here and there when I change the hex. I also want to change the border type from a 3dish window frame to a solid line. Can anyone help me please. Hi all, I was wondering if someone could help me. I want a border around the entire page. It works fine in IE at all resolutions, but breaks in FF. I explicitly stated html and body heights to be 100% but that doesn't help. I should be able to spot the error, but its escaping me. Can someone please look at my code and tell me if you see anything? Thanks Rick --- The HTML: 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>San Jose Cell Phones</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body style="font-family:verdana,tahoma, sans-serif;">
<div style="margin-left:3%;">
<h1 style="font-size:4pt;color:#ffffff;">San Jose Cell Phones ringtones AT&T Yahoo dsl satellite 408 calling dish network</h1>
<div align ="center">
<img src="images/sanjose.png" alt="san jose" style="width:195px;height:39px; vertical-align:middle;" />
<img src="images/smallcellphone.jpg" alt="san jose cell phones logo" style="width:72px; height:204px; padding:20px; vertical-align:middle;" />
<img src="images/cellphones.png" alt="cell phones" style="width:246px;height:39px; vertical-align:middle;" />
</div>
<h4>Choose Service</h4>
<div class="container">
<ul id="navSquare">
<!-- CSS Tabs -->
<li><a class="active" href="index.html">Cellular</a></li>
<li><a href="ringtones.html">Ringtones</a></li>
<li><a href="phonecards.html">Phonecards</a></li>
<li><a href="dishnetwork.html">Dish Network</a></li>
<li><a href="dsl.html">DSL Service</a></li>
</ul>
</div>
<hr align="center" width="33%" />
<br clear ="all" />
<div style="float:left;color:#006699;width:250px;">
<div style="background-color:#006699;color:#ffffcc;margin-top:30px;height:10px;padding:3px 10px 3px 10px;border:1px solid black;border-bottom:0px;">Hi</div>
<div style="line-height:1.3em;padding:10px;text-align:justify;background-color:#FFFFCC;border:1px solid black;">
<p style="font-size:11pt;font-weight:600;padding-top:10px;">The Original Online Prepaid<br />
Domestic and International<br />
Calling Cards Superstore</p>
<p><strong>Save up to 80% on long distance calls</strong>
<br />
We hand-pick our phone card selection to offer the best of both low cost and reliability. Don't be fooled by other's low teaser rates. We pioneered instant email calling card delivery in 1999, with over 600,000 sold as of September 2006!
<br /><br />
<strong>How to use this web site</strong> Use Get Best Rates to choose your phone card, then receive your virtual phone card purchase by email. For a physical card, print the email containing the card image. Login to your account 24 hours a day to check PIN information or to reorder</p>
</div>
</div>
<div style="color:#ffffcc;float:left;clear:none;margin-left:20px;width:460px;">
<div style="background-color:#006699;margin-top:30px;height:10px;padding:3px 10px 3px 10px;border:1px solid black;border-bottom:0px;">FINDING
THE BEST PHONE CARD</div>
<div style="float:right;clear:none;padding-top:10px;padding-left:3px;padding-right:3px;width:209px;height:158px;">
<script type="text/javascript" language="JavaScript" src="http://www.kqzyfj.com/placeholder-1405157?target=_top&mouseover=N">
</script>
</div>
<div style="padding:10px 5px 30px 5px;text-align:justify;background-color:#7691d4;border:1px solid black">
<p style="font-size:14pt;padding-left:5px;margin-bottom:-5px;">Is your need for</p>
<p style="line-height:1.5em;white-space:nowrap;font-size:.75em;">
<font face="Arial">► </font> International calls from the U.S.?<br />
<font face="Arial">► </font> International calls to the U.S.?<br />
<font face="Arial">► </font> Calling within the U.S.?<br />
<font face="Arial">► </font> Calls while traveling?<br />
<font face="Arial">► </font> Specific recommendations?<br />
<font face="Arial">► </font> Wireless/cell phone refill PINs?
</p>
</div>
</div>
<!--
<div align="center">
<p class="sectionheading"><a name="phonecards" id="phonecards">Phone Cards</a></p>
<a href="http://www.kqzyfj.com/3566vpyvpxCFEKIDFLCEDGDGMLF" target="_blank" onmouseover="window.status='http://www.zaptel.com';return true;" onmouseout="window.status=' ';return true;">
<img src="http://www.lduhtrp.net/o4101r6Az42ORQWUPRXOQPSPSYXR" alt="Buy the best phone cards at San Jose Cell Phones" width="300" height="250" border="0"/></a></div>
<br />
<hr align="center" width="25%" />
<div style="text-align:center;margin:0 auto;margin-top:25px;"><a class="button" href="#top">Top of Page</a></div>
<br />-->
</div>
</body>
</html>
The CSS: Code: html,body
{
height:100%;
}
body
{
background-color:#ffffff;
border: 2px #279DA4 solid;
font-family:'Berlin Sans FB Demi', 'Berlin Sans FB', Verdana,'Trebuchet MS',tahoma, sans-serif;
font-size:10pt;
}
.container
{
width: 500px;
padding: 5px;
margin:0 auto;
border: 1px solid #ccc;
background: #fff;
margin-bottom:10px;
}
Hey everyone, im creating my first site, its an anniversary present for my girlfriend and this is what i want. The first page of my site will have a picture center of the page in the middle. Underneath this i want a login table? with a drop down user name box containing 2 user names "hers" and "mine"and a password box next to that, underneath this a submit button... here is the code i currently have.. <body bgcolor="black"> <img src="\C:\homepage\pics\image1.jpg" width="300" height="300"> </a> <fieldset> <legend> <font color="white"<big><b>Login</b></big> <form action=""> <select name="user"> <option value="name1">name1</option> <option value="name2">name2</option> </select> <font color="white"><b>Password:</b></font> <input type="password" name="password"><br> <input type="button" value="Submit"> </form> <p> </body> Questions: how do i get my picture center middle of the page? how do i set passwords that the site will recognise? how do i get the submit button to launch the next page of my site if the password/s are correct? or am i nuts for my first page? lol and going about this the wrong way? ideas? input? recommendations? cheers LB Hi, How can I link to a directory inside my website so it shows inside my page instead of alike you just link to the directory. So like the directory to my files is httlp:/mysite.com/download/. I can link to it directly just like that but I want it to show inside my website. How can I do that? Thanks. PROBLEM SOLVED Hi, I'm new here but know a little bit about making websites. This one has seemed to stumped me, my webpage he Edit: link removed, problem solved and the other links: Order online, testimonials, about us, and contact us all render exactly in firefox, however my products page gets shoved to the left a couple of clicks for some odd reason. I narrowed it down a bit; it seems as if its only letting me to post a few paragraphs until it does it, meaning i can remove the animation and some paragraphs, and it looks the way i want it, but when I add the paragraphs back even without the slideshow the problem persists. Using expression web 3. Thank You a bunch for your help. Edited: Seo Concerns. Hi, I am using Dreamweaver CS3 to create a site, by default i have learnt that when you use an image as a link to another page, dreamweaver creates a coloured border around your linked image. I have since been able to get rid of this border by adding border="0" into my img tag however this now has caused my rollover not to work before clicking on the image to take you to the linked page. this is my code; any ideas how i can fix this? <td colspan="4"> <a href="About Us.html"><img src="images/About_Off.jpg" border="0" alt="About Us" name="Aboutus" width="120" height="64" id="Aboutus" onMouseOver="MM_swapImage('Image2','','images/About_On.jpg',1)" onMouseOut="MM_swapImgRestore()"></a></td> <td colspan="6"> Any help would be greatly appreciated. Hello I'm trying to create a page, when its someone's first time opening the web site they get asked if they are under 18 or not and if they are over 18 and enter the site, and the next time they come to the site, it would by pass the age page. Is there anything that I can read that would help me create it? Please give me any suggestion that you have. Thank You Hello, I'm a windows app programmer, but don't know too much about HTML. I use Frontpage to maintain my web site. I need to check the referring page, and if it equals what I want, then I need to redirect to another page. OK, to explain further, I've had a web site for years. Lets call it www.p.com. Yesterday, I registered two new domain names, we'll call them www.a.com and www.b.com. I had my web host simply make them pointers directly to www.p.com. So, when users type in www.a.com or www.b.com, they are automatically taken to www.p.com. This is OK...but, it is causing some issues. What I'd like to do is, when the page (www.p.com) is loaded, I want the page to check the page the user came from, such as www.a.com. If it was www.a.com or www.b.com, then I want to re-load www.p.com, so that the page is refreshed so that it actually was www.p.com and not a re-direct from www.a.com. Can I do this? and how can this be done? Many thanks in advance! domls Hi, I am trying to set up a webpage where the only way someone can access it is if they came from my facebook page. What is the easiest way to do this? thanks in advance. I am a website designer . don't know much about the programing. anyone can guide me. I can connect any admin in my simple html website. i want to add/edit image/content. if possible than please tell me how can i do this. Thanks Neeraj Sharma neeraj10786@rediff.com Hi Guys, I have a simple question, I havent done any web/html stuff for a long time, ive totally forgotton how to do everything. At the moment im working on a small project, I was thinking of running it off a database but I think its way to complicated even for that as all I need is a single html page that populates with information that I have when certain inormation is entered. Basically its a contact list, name, number, ID, landline fax number etc. I have a list of about 400 names which I want to be searched by a ID and state, so for example, theres 2 data entry boxes, one is a drop down box of states and the next is a text entry field where you enter the ID (3 digits) once selected, it populates another text field with the information. I want all the info to remain on a single page, or maybe the info on another page and displayed on the main page when the propriate ID number is entered. Id prefer it this way as I can easily edit the page with text. I dont think a database is appropriate, as I need to run this locally. Does anyone have any idea what I need to do to get this done? Id appreciate any help. Thanks alot Ok, This might be a bit confusing but ill try my best. On my main website homepage i have a splash image which when clicked redirects to the main website, also in another folder i have a phpbb3 Forum. Below the image on my homepage i have a login box for the forum as well. What i would like to do is to hide that login box unless a keyword is entered before hand, and make the domain.com/forum URL inaccessible unless you login through this route. basically hiding the forum completely so people dont actually know its there. I could do this through .htaccess however i was hoping there was a "cleaner" way to do this. Many Thanks Rob Can i just place some html in between the head tags or ?? to make the text change to arial for example? Hi All, Please Heeeeeeeeeeeeeeeeeeeeeeeeeeeellllllppp!!!!! Thanks in advanced!!! Have a few mistakes and / or something is missing below: Code: <html>
<head>PLEASE FIND THE MISTAKE(S) or SOMETHING MISSING /</head>
<script type="text/javascript">
window.onload=function()
{
document.getElementById('exampleletterList').onchange=function()
{
window.location=('http://www.example.org/'+this.value+'');
}
}
</script>
<body>
<select id="exampleletterList">
<a target=\"_blank\" href=\"file.doc\" title=\"\">John Doe<br> XXXXXXXXXXX</br></a>.
<option value=""><b> PLEASE SELECT THE FOLLOWING: <b/> </option><!--this option takes you to -->
<body mar="0" marginheight="0" bgcolor="rgb(38,38,38)">
"BACKGROUND BLUE GREEN MARMOL "
<embed width="100%" height="100%" name="plugin"
src="http://www.example.pdf"
type="application/pdf">
<br>
<CENTER>
<option value=index.htm>Option #1</option><!--this option takes you to -->
<option value="example7">Option #2</option><!--this option takes you to -->
<option value="example3">Option #3 </option><!--this option takes you to -->
<option value="example4"><br>Option #4</br></option><!--this option takes you to -->
<option value="example5">Option #5</option><!--this option takes you to -->
<option value="example2">Option #6</option><!--this option takes you to -->
<option value="blog/wp-login.php"><!--this option takes you to blog-->
</select>
</CENTER>
</br>
</body>
<html xmlns:v="urn:schemas-microsoft-com:vml"
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy
zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz
</body>
</head>
</html>
I am wondering if it is possible to create an INDEX.HTML to redirect to another website? I would like it to display the redirected site, but if possible keep to the original address.. e.g. A site named www.mysite.com, with an INDEX.HTML to redirect to www.othersite.com, which displays OTHERSITE with www.mysite.com in the address bar. Hope I explained ok, any responce would be much appricated! Thanks! Hi, is there a way to put a border around only some parts of a table? I've tried using css, but it didn't work: <p style="border-bottom: 1px; border-left: 1px; border-right: 1px; border-top: 1px"> can anyone help? thanks |
|||||||