|
HTML - Help, One Page Of My Site Is Shifted To The Left
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. Similar TutorialsHey everyone, this is my first time designing a website and I am having a little trouble with IE8. I have checked the website on every browser I can think of and only on Internet explorer 8 does it decide to shift the entire website to the left. I am not very good at writing code, and I am even worse at reading it for errors. Can anyone look at my code and find out what is making the website all screwy when viewed through internet explorer? www.whatyoushouldbedoingrightnow.com Also, the title bar has a random mirror image that appears.... but again this only happens in IE. Ok, so here is the problem, i am working on my page, and i wanted to place an image of a home for sale sign on the page and end in a checkerboard divider, and wrap my text around it... everything looked great until i got to the bottom of the page, then i realized my footer was shifted way right, and so was my checkerboard... what did i do wrong? http://www.budgetbathusa.com/real-estate-remodel.php here is the relevent code... <img style="float:left;" src="http://budgetbathusa.com/images/real_estate_remodel2.jpg"> <? include('./includes/contact_form.inc.php'); ?> <img style="float:left;" src="http://budgetbathusa.com/images/sidebar.jpg"> <center><h2>Selling Your Home? We Can Help.</h3></center> <p> This product is for all of you who are in the process of selling your home, and would like to get your home off the market as fast as possible. Everyone knows that the two rooms that will sell your home are kitchens and baths, but what most people dont know is that the average price to remodel those rooms are $57,232 for kitchens, and $15,899 for bathrooms. Those figures are not fictitious either, they are pulled from national average costs at Remodeling Magazine's own figures (you can see those figures at Remodeling magazines <a href="http://www.remodeling.hw.net/2008/costvsvalue/division/south-atlantic.aspx">Cost vs. Value webpage.)</a></p> <p> As you already know, home staging requires moving furniture, painting walls, and other miscellaneous activities to make your home more attractive to prospective buyers, but there are many other remodeling projects you need to seriously consider. One of those is that bathroom you never like showing to your guests, or that bathroom that isn't that bad, but has that mildew on the grout, and fixtures from 1957. You have two options...<ol> <li>You can do a total remodel, that will cost almost $16,000 and sell your home quickly, and for more than you were asking for. (but who has an extra $16,000 laying around!)</li> <li>Or you can choose from our A la Carte list of bathroom remodeling services, that will cheaply, and effectively remodel your bathroom for a fraction of the cost of a custom remodeling job, <b>and</b> be of a better quality than a bathfitter bathtub liner.</li> <h2>The List:</h2> <p> So we have brought you a list of different services at the lowest prices we can offer. You get to choose what you need, and not get anything extra. All we require is that you pick $3000 dollars worth of remodeling. and we will be happy to come out and help your bathroom out. These prices are non-negotiable, and are a great deal just by themselves. Then fill out our contact form, or give us a call, and we will write up the contract, and do the work.</p> <ul><font size="4" color="#5eadfd"><b> <li>regrout bathroom (silicone included): $2.75 per square foot</li> <li>re-silicone bathtub without grout: $125</li> <li>Replace Shower Door: $750</li> <li>Replace Vanity and Vanity Countertop (Faucet included): $800 {upgrades available}</li> <li>Replace over the toilette Storage Unit: $250</li> <li>Replace Medicine Cabinet: $250</li> <li>Replace Toilette: $400</li> <li>Replace Trim: *</li> <li>Glass Shelving Addition: $100</li> <li>Repaint Bathroom: $600 (Price based off of an 8x5 bathroom)</li> <li>Upgrade lighting: $250 per light</li> <li>Change faceplates: $5 per plate</li> <li>Upgrade Sink Faucet: $375</li> <li>Upgrade Shower Faucet: *</li> <li>Change Toilette Seat: $150</li> <li>Replace Window $475</li> <li>Plumbing Inspection: $100</li> <li>Replace Sink Trap $250</li> <li>Tub Refinishing: $900 per tub.</li></font></b></ul> <p> <b>* :</b> Prices vary greatly depending on different situations, just give us a call and we can work it out. <p> <b>Note:</b> Most prices are dependent upon an allowance for material, if you would like something nicer, we will gladly upgrade for you</p> <img src="/images/checker_hr_24.gif" width="744" height="24" style="float:left;" alt="----------" /> <br /> <? include_once('./includes/footer.php'); ?> I've attached the code for a template I'm wanting to use. I want to add a column to the left side of the page that runs the length of the page. Is there anyone out there who can assist me with the code to do that. I'd be exceedingly grateful. I'm afraid I'm table dyslexic. Thanks in advance to anyone who can help. I'm just starting to get into HTML / CSS and I had a question I was hoping someone would be able to give me a hand with... The page I'm working on has a logo in the top left corner that gets cut off when the browser window is reduced to a smaller size. The left navigation bar, however, always appears in the browser window, regardless of size. I'd like to have this left side "anchor" to include the logo so that it always appears. Please let me know if you require additional information or if I have not described the issue clearly enough. Thank you! How can I make the text appear at left bottom... I have 3 taGS RETURNING DATA FROM sql: <p> #TOC# </p> <p> BUSINESS POLICY TRADEMARK REGULATIONS. </p> <p> #Qry.USERSIGN# </p> I want the text from this tag to appear one after other at left bottom: For example: This is basic algebra lesson. BUSINESS POLICY TRADEMARK REGULATIONS. Smith How to do that? Any advise is appreciated.RosieGp Hello Everyone, i am new to HTML, i am trying to develop my first website. I am using asp.net , C#, HTML, CSS and Visual studio2008 on windows Xp I had a page, in that i moved the tables to center. after moving the tables to center i found the white space on the left and right sides of the page. Now i want to fill the white space which is on the left and right sides of the page with the black color. Can anyone please help me thank you regards john. I have a left menu column but it's not stretching down the length of the page. The page is quite long and when the links are finished on left column it just ends and as it has abackground colour it looks a little strange. It is floated left and the main_section is also floated left. It is the main section div that is long. I was thinking because this is in a div that the left coumn is also in that the left column would therefore stretch to the length of it's parent div. Any ideas? http://absolute-websites.com/services.html is the link so you can see what I'm talking about. Here is a section of the HTML : HTML Code:
<div class="left_column">
<div class="breadcrumb"><p><a href="index.html">home ></a>services</p></div>
<div class="icons"><p><a href="services.html#websiteProduction"><img src="images/webIcon-01.png" title="web building" alt="web building icon"/></a></p></div>
<div class="icons"><p><a href="services.html#hosting"><img src="images/hostingImgIcon-01.png" title="Hosting & Domain Names" alt="Hosting & Domain Names icon"/></a></p></div>
<div class="icons"> <p><a href="services.html#seo" ><img src="images/seo2Icon-01.png" title="Search Engine Optimisation" alt="Search Engine Optimisation icon"/></a></p></div>
<div class="icons"> <p ><a href="services.html#marketing"><img src="images/advertsIcon-01.png" title="Marketing" alt="marketing icon"/></a></p></div>
<div class="icons"><p ><a href="services.html#design" ><img src="images/designImgIcon-01.png" title="Design" alt="Design icon"/></a></p></div>
<div class="icons"> <p ><a href="services.html#photo" ><img src="images/photoIcon-01.png" title="Photoditing" alt="Photoediting icon"/></a></p></div>
<div class="icons"> <p><a href="services.html#video" ><img src="images/videoIcon-01.png" title="Video Production" alt="Video Production icon"/></a></p></div>
</div>
<div id="main_content" class="fl">
<h1 class="h1SecHead" >>SERVICES</h1>
I have the following Web Page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="en-gb" http-equiv="Content-Language" /> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> </head> <body > <div style="margin:auto;text-align:center"> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> </div></body> </html> If I add another DIV with an image inside it, the images all move to the left by 8 to 10 pixels. This is the second version of the page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="en-gb" http-equiv="Content-Language" /> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> </head> <body > <div style="margin:auto;text-align:center"> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> </div></body> </html> I have no idea why the page center moves to the left, but it means that I can't get my page banner to appear the same on every page. (I've stripped out all the extra content and codes to just leave the offending images.) I primarily use Firefox, but the same is happening in IE and Opera. Can anybody tell me what's happening? (I apologise if this is a well known, frequently asked question, but I couldn't find an answer and this is driving me up the wall, so any help is appreciated.) Hi there I'm trying to make a website for a friend - http://wwwdev.cfpaddler.co.uk. At the top of the site is a 1x40 pixel (WxH) GIF - a horizontal gradient - that is told to have a width of 100% so that it takes up the entire width of the browser window, regardless of resolution. I want to put a 250-pixel-wide JPEG immediately to the left of this GIF and then make the GIF take up the rest of the space available. I tried setting the GIF width to 100% again but it puts the JPEG on the top line and then stretches the GIF across the entire window just beneath it. I'd be happy to use PHP (although I'm a beginner at it) to maybe detect the user's browser window width (if it's possible?) then perform a calculation to find what 100% width minus 250 pixels is... Any suggestions are very much appreciated; thanks for taking the time to read this. Chris Images in question are http://wwwdev.cfpaddler.co.uk/images/top_border.gif and http://wwwdev.cfpaddler.co.uk/images/top_logo.jpg. Hi. I can't figure out how to have all the tables on my site aligned to the centre yet have the text in them aligned to the left. In other words I want 2 margins either side of the central body of my site. How can I do this? Thanks. Hi everyone, I'm trying to work out how to have a left and right side "column" both resize when the window is resized. An example of what I am after is : http://www.news.com.au/heraldsun/0,,,00.html. I played with margin-left and -right but don't think it is quite what I am after. Thanks. Hello everyone. I am having the worst time trying to figure this one out. I created a site for a hair salon and every time the page loads for the first time, it jumps from right to left. Does anyone know why it is doing this? There is an example link below. Thank you so much for taking the time to read this. http://www.erizzo.net/studiod/index.html Greetings, Thanks in advance for any help. Basically, I'm new to HTML, I've made a site with an external CSS file, its all good, except that all the elements stay to the left. The browser background is grey, the actual page background is white (its an image, however, not just the colour). The page adjusts when I resize the IE window, but nothing else does, they just stay there. I've tried absolute positioning, relative, and so on, but nothing seems to fix it. How do I get the elements to move? I've attached the CSS and index file (named portfolio) for reference. I apologise in advance for my general noobiness. I hope the poorly written attachments don't hinder the helping process. Thank you, Panda. Hi All, I have just started my first page and there is a little problem with it that is driving me nuts. Basically, Im trying to make a simple page where the content is centered and there are two background columns on the right and left: we see these pages everywhere. Here is the code (pseudo) I am trying <body> <centered content> <body_divis> <pic> insert picture (top left) <pic> </body_div> </centered content> <body> now im using a css file in which we have: <centetred content> : fix width (1000px), auto left and right margin, gray background. <body_div>: white background. <pic>: 0 margins. So far so good, I get the desired effect: white page in the middle, two side columns in gray. All of this starts at the very top of the page. Now I just want to move the picture slighlty down. As soon as I do that the whole white centered section moves down with it, creating a horizental gray bar on top of the page that is driving me nuts.... it seems that the white section starts where the first object is placed. I just want it to start at the top and then plance my objects wherever. All margins are good in my code as I have checked and rechecked. I appreciate any help. Thanks, Kakeez 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, 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% }
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 Edited: Seo Concerns. 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 |
|||||||