HTML - Strange Alignment Issues

Hey everyone! I am completely new to webpage design and have enjoyed some parts of it! I have just been teaching myself as I go and viewing tutorials to learn most of what I have done. Now I am in a jumble and have no idea what to do. I am working ... my main problem is things aligning correctly. I am working on this for a friend and really would like to just be done with it! Please check it out, I attached the pages so maybe you can lead me in the right direction. I believe I have not positioned things correctly. They appear okay sometimes on internet explorer / funcky on firefox / and reallly crazy on safari! Also, the navagation bar is very glitchy, maybe I shouldn't have done a flash navigation? Im going nuts over here! I appreciate all your help.

Hello,
I made a very simple table layout (with photoshop and imageready) and its my very first time making this type of layout so I'm having a little trouble with the coding. I haven't added a style.css file to it, except for maybe the css that wraps my navigation to a certain width.

Here is the url: http://rezina.awardspace.com/layout01

I can't seem to align the images correctly. My friend told me that one of the images was not sliced correctly, so I sliced it but .. it kind of fixed the right side, and not the left.

Also, the extra.jpg (which is the outside background-the stripes) seems to repeat itself both vertically and horizontally, is there a way to fix that?

Thanks. =))

oh. oops. I just read the rules, sorry for the vague title. I would try changing it to be more specific but I don't know how..

Hello, quick question here.
I'm working on this site: (replace @'s with a's)
v@rd@burstyn.com/version2/

The previous designer left it in a bit of a mess, and now that I've made some changes that appear nicely in my Safari browser, the tables are hugely misaligned when I look at a number of the pages in Firefox (i.e., water.html or rites.html).

Any advice as to how to get the tables back under control? I've tried for a while but nothing seems to fix it.

Thanks very much in advance.

Dear forums!
I'm having issue with an padding-problem which i'm not able to solve on my own. I don't understand why my code returns the problems that it does, but it for some reason does.

Okay, what is the problem?

I've drawn them into this picture;
http://i42.tinypic.com/4v1veo.png
The problem is that the first navigation-button starts off with about 10-15 pixels, and ends about 3 pixels out of the actual navbar (if you check the borders).

I would like to remove this, so that the navbar button covers the whole area of the navbar div / element, without starting too late or ending too late.




CSS code can be found here;
http://www.myhrensolutions.net/tolkf...sign/index.css

the HTML-code can be viewed here;
http://www.myhrensolutions.net/tolkfirma/tjenester.html


All help is muchly appriciated,
thank you!

- Scott.

Hey guys,

I have been designing a portfolio for my photography for some time.

There are a few issues I have and I would appreciate your help.



http://fjchapman.com/portfolio/portfolio.html

1. If you'll notice, the SWF object won't open.

If you go to http://fjchapman.com/portfolio/viewer.swf , the swf is fine. There is just something wrong with my code.

2. Why is it so screwed up in IE?

I have been going through my code but I cannot understand why IE is adding some mysterious padding. Help?

3. Alignment of links.

While the links are just fillers (concert photography, portraits) for now, how can I have them aligned to the bottom left of my header?


Thank you guys so much for your time.

Hello, I just made my new site for my company and I tried to keep it extremely simple. I used wordpress to do the basic layout automatically and made some simple edits with some basic html i picked up along the way this week. There seems to be two problems though:


1) the form is inside a table which doesnt seem to align properly within any of the popular browsers (firefox/IE/chrome) .... it should look like 1 image instead of 3 separate pieces

2) i eventually got the form to align slightly better but the spot where I "Enter my zip code" doesnt align with the background image behind it.....sometimes it doesnt even say "enter zip code" which is very bad for a user experience. in firefox it doesnt say it, but in chrome it does say it....either way, both are aligned very poorly.....


I put my code into this site:
http://w3schools.com/html/tryit.asp?...=tryhtml_intro

...and after editing it, i've come to find that it works perfectly within that html editor and looks exactly how i want it to look. but then when i put the code back into my wordpress site, the alignment messes up again......

so i did some research and found out that wordpress has "deprecated" some of the html tags and that they dont work anymore...if i understand correctly. so now i have to find a way to pick new tags or use CSS...this is just so confusing and i thought maybe somebody here might be able to offer me some assistance to help me fix up this form/table problem.

my site's url is:
http://www.allautoinsurance.org

my code that I'm editing is on the right sidebar, where the alignment messes up:

<div style="text-align: center;"><span style="font-size: 14pt; font-family: Georgia; color: rgb(0, 0, 0);"><span style="font-size: 14pt;"><span style="font-size: 14pt;">Our free online service instantly browses the best rates in your zip code area at the click of a button. We've helped thousands of people quickly and easily save money on their auto insurance:</span></span></span><br />
<br />

<form action="http://network.mossaffiliatemarketing.com/z/61/CD62/&subid3= "method="post">
<table border="0" cellpadding="0" cellspacing="0" width="225">
<tr>
<td colspan="2"><img src="http://www.allautoinsurance.org/wp-content/uploads/2009/08/top.jpg"></td>
</tr>

<tr>
<td class="background1" valign="middle" height="54" width="153">
<style>
.background1 {
background-image: url(http://www.allautoinsurance.org/wp-c...tom_left.jpg);
background-repeat: no-repeat;
}
</style>

<input type="text" name="subid1" value="ENTER ZIP CODE" style="margin-left:30px; margin-bottom:5px; width:110px; border-width:0px; font-size:14px; font-family: Arial, Helvetica, sans-serif;" onClick="javascript:this.value='';">
</td>
<td>
<input type="image" src="http://www.allautoinsurance.org/wp-content/uploads/2009/08/bottom_right.jpg"></td>
</tr>
</table>

</form>

</div>
<div style="text-align: left;"><span style="font-size: 12pt;"><span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 1)</span> Input your zip code and click the button above to begin browsing the auto insurance providers in your area</span></span></span><br />
<br />
<span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 2)</span> Select the auto insurance provider you're most comfortable with by clicking their picture<span style="font-weight: bold; color: rgb(255, 0, 0); font-size: 12pt;">&nbsp; </span></span></span></span><br />
<span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(255, 0, 0); font-size: 12pt;">Warning</span>: Dont <span style="font-style: italic; font-size: 12pt;">always </span>go with the cheapest in the area</span></span></span><br />
<br />
<span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 3)</span> Continue with the providers process if they meet your requirements</span></span></span></span><br />
</div>
<div style="margin-left: 40px;"><span style="font-size: 10pt; font-family: Georgia;"><span style="font-size: 10pt;"></span></span></div><span style="font-size: 10pt; font-family: Georgia;"><span style="font-size: 10pt;"><br />
<span style="font-size: 12pt;">***We've been showing people how to get insurance quickly and easily for years.&nbsp; We respect your privacy, it is just as important to us as it is to you.</span></span></span>



.....thanks for any help, i really appreciate your time and effort. if this code doesnt look smart at all its cuz i used some free WYSIWYG editor to generate it. i actually am very confused lol. thanks again.
Best,
Kyle P

I'm having a really bizarre problem on my site here http://www.onlykitchens-almunecar.co...signvisit.html

On this particular page I have a form that is working fine in firefox but the page won't load in IE only from today and I don't think I have changed anything

The form is working fine in firefox and posting ok and returning errors as i am using this form validation script Code:

  <script language="JavaScript" type="text/javascript">
<!--

/***********************************************
* Required field(s) validation v1.10- By NavSurf
* Visit Nav Surf at http://navsurf.com
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

function formCheck(formobj){
 // Enter name of mandatory fields
 var fieldRequired = Array("Name", "Surname", "Address", "Town", "Province", "Post Code", "Telephone", "Email", "Selection", "Details");
 // Enter field description to appear in the dialog box
 var fieldDescription = Array("Name", "Surname", "Address", "Town", "Province", "Post Code", "Telephone", "Email", "Selection", "Details");
 // dialog message
 var alertMsg = "Please complete the following fields:\n";
 
 var l_Msg = alertMsg.length;
 
 for (var i = 0; i < fieldRequired.length; i++){
  var obj = formobj.elements[fieldRequired[i]];
  if (obj){
   switch(obj.type){
   case "select-one":
    if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){
     alertMsg += " - " + fieldDescription[i] + "\n";
    }
    break;
   case "select-multiple":
    if (obj.selectedIndex == -1){
     alertMsg += " - " + fieldDescription[i] + "\n";
    }
    break;
   case "text":
   case "textarea":
    if (obj.value == "" || obj.value == null){
     alertMsg += " - " + fieldDescription[i] + "\n";
    }
    break;
   default:
   }
   if (obj.type == undefined){
    var blnchecked = false;
    for (var j = 0; j < obj.length; j++){
     if (obj[j].checked){
      blnchecked = true;
     }
    }
    if (!blnchecked){
     alertMsg += " - " + fieldDescription[i] + "\n";
    }
   }
  }
 }

 if (alertMsg.length == l_Msg){
  return true;
 }else{
  alert(alertMsg);
  return false;
 }
}
// -->
</script>

The weird thing is if i take this code out it loads in IE and when I put it back in it don't. Its been working fine in IE with it in up until today. I need this validation script, and as i said its been working in IE for weeks with it in in.

So I suppose what I am trying to get to the bottom of is why it is working in firefox but not in IE? If anyone could help i'd greatly appreciate it!

Well, it seemes like it all messes up right now... And I'm going crazy.

Take a look at this example page:
http://www.stianbl.co.cc/Test2/teknisk_TEST1.html

Here, everything should work, since the code is the same I used for this page:
http://www.stianbl.co.cc/Test2/teamet.html

The problem is:
1. I cant get the hover effect to work on the 3 "pages", or fact-sheets, that should be clickable to dll the .doc file. But its the same way I did on the site "teamet", and it works there.

2.I cant position the header anymore. As it is now, opera reads it as I want it (the header, and navigation part), but IE hides it...

Any help would be much appreaciated!

hi,

I have a css popup window (a lightbox) for videos, opened by javascript.

If I want to close it, I've to select the white overlay on the background.

On Windows, everything works very well in Firefox, IE and Safari.

On Mac, I can't use the flash player controls because when I click on it, the video is closed (I guess because the overlay is selected even if it is behind the video).

Isn't strange ?

thanks

Now this is a strange one.
If you visit my site via
http://amatoc.com
and then you visit it with
http://www.amatoc.com
You will notice that the site with www added is smaller than the one without!

(Occurs using firefox)

Anyone have an explanation for this?

Hi,

I'm trying to make some changes to the basic design of my site, but when I add Adsense it's doing something strange.

In IE7 it's fine, but in FF it displays with incorrect colors and the size is chopped from 468x60 to about 230x60.

I can't explain it, because on the other pages I've made the changes everything is fine.

*****************************************
Problem seems corrected now. Have no idea how it persisted for 36hrs, but it's fine now (shaking head).
*****************************************

Thanks,
Dave H

I am working on a new site layout, and for some reason in IE6/IE7 if you go directly to the webpage I am working on, it doesn't load correctly (won't load my background gradient, and doesn't format the site properly) when I try to reload the page, I get the same problem. if I go to any site (with css, without css, etc) and then go to my page it loads properly. the source code is the same when it loads properly and when it doesn't so I have absolutely no idea how to fix this problem.

Regards,
David King

I have two sections of my school website, one for study, one for plans. I have indexes for each, and links in the indexes that go to "journals." Sadly, for some reason, the plans one is working find, when I click on a link in the index it stays in the same category and then goes down, but the study one goes to my homepage. I'll try doing a diagram to help you guys out

The arrows represent a link I can click on:
(I took out the http b/c this site made the links shorter with ... and you wouldn't be able to see what I'm about to point out)
Plans Section
http://linus.yhspatriot.net/cs/at/st...Cai/2006/Plans -->
http://linus.yhspatriot.net/cs/at/st...lan.html#Intro

Study Section (Doesn't work)
http://linus.yhspatriot.net/cs/at/st...Cai/2006/Study -->
http://linus.yhspatriot.net/cs/at/st...-11.html#12-11

Notice the problem is that in the first one, it stays in plans, but in the second one, it actually leaves Study, and goes to Folsom_Cai.

Here's the code for the plans index:

HTML Code:

<ol>
<li> 1st Quarter Plan (finished)</li>
<ul>
<li><a href="1stQuarterPlan.html#Intro">Introduction</a></li>
</ul>
</ol>

Here's the code for the Study index:
HTML Code:

<li>Week of 12-11
<ul>
<li><a href="12-11.html#12-11">Thinking about the Classroom Code</a></li>
</ul>
</li>

Here's where I define the name <a name=""> so it will go to a certain part of the page

Plans:
HTML Code:

<p><a name="Intro"></a></p>

Study:
HTML Code:

<h3><a name="12-11"><span>12-11</span></a></h3>

thanx for any help, feel free to ask a question - i'll respond in this forum

I designed a site using HTML and CSS.
The site works fine on all browsers except on the client's pc. He has IE 7. When I try it on my computer using the same browser IE7 it works fine. I told him to try the site on FFox and it worked ok.
He wants the site to run on his pc using IE. I tried asking him to clear all cookies... doenst work.

Any ideas want can be the problem?

THANKS!