HTML - Alignment Issue In Firefox

I want to display label and input element like below,

Code:

                user name: <text box>
            email address: <text box>
                                   <some lengthy text>
confirm email address: <text box>

I don't want to use table. All the colons at the end of the label should align vertically.
All the text boxes also must align vertically.
<some lengthy text> must be right aligned along with text boxes. this may wrap to multiple lines. wrapped text also right aligned along with text boxes.
please help me. thanks.

Hi folks,

I'm having a distressing issue with my website. I have a table of thumbnails that must line up very specifically to fit with a background image. Not so hard, the page appears perfectly when I view it by itself (http://natehess.org/working/work/rec...rk_layout.html)

But when I drop it into a Scrolling DIV script (Aaron Boodman's) a get a peculiar spacing issue on the set of 8 thumbnails in *FireFox*. The issue doesn't appear in IE, but gotta get it right.

The problem page is http://natehess.org/working/work/recent_work.html

If anyone would be willing to provide a reccomendation or slog through my code I'd appreciate it. I built the page in dreamweaver, so it's not the cleanest code ever, but I'm at a loss at this point.

Thanks so much for any help.

Can someone please help me and shed light on this? TIA!!
I'm building an ecommerce site and there are 4 thumbnails that you can click on, then the main image swaps to the thumbnail you just clicked on (like how most ecommerce sites work). But I won't have 4 thumbnails all the time, maybe 2 or 3 but maximum of 4. When I test the page with 4 thumbnails, it works fine. But if I have only 2 or 3 thumbnails, the spacing looks odd on Firefox. (Looks perfect on Safari) I want them to be always left justified but they look like they are forced to be centered in the space given. What am I doing wrong? I appreciate any help!
The following code is for the thumbnail:
Code:

<tr>            <td width="60" align="left"><a href="#" onClick="javascript:image_click(1);return false;"><img border="0" src="thumbnail.asp?file=[image1]&maxx=60&maxy=0" name="pimage1"></a> </td>
                <td width="5" align="center"></td>
                <td width="60" align="left"><a href="#" onClick="javascript:image_click(2);return false;"><img border="0" src="thumbnail.asp?file=[image2]&maxx=60&maxy=0" name="pimage2"></a> </td>
                <td width="5" align="center"></td>
                <!--END: image2-->
                <!--START: image3-->
                <td width="60" align="left"><a href="#" onClick="javascript:image_click(3);return false;"><img border="0" src="thumbnail.asp?file=[image3]&maxx=60&maxy=0" name="pimage3"></a> </td>
                <td width="5" align="center"></td>
                <!--END: image3-->
                <!--START: image4-->
                <td width="60" align="left"><a href="#" onClick="javascript:image_click(4);return false;"><img border="0" src="thumbnail.asp?file=[image4]&maxx=60&maxy=0" name="pimage4"></a> </td>
                <td width="5" align="center"></td>
                <td width="60" align="left"></td></tr>
                <!--END: image4-->

http://www.jakobmetzger.com/misc/sites/kindling/

In IE the only pages that render correctly where the top blue line that goes across the screen is the forums page. the other pages have a black space to the right of the menu. Any ideas?

I am trying to left-align this table and I cannot figure out why it will not behave. Mind you, the problem is only occurring in IE7 - IE8 and Firefox are fine. Please help?


Code:

<table summary="main content panel" align="left" bgcolor="#ffffff" border="0" cellpadding="0" width="535" height="200">
<tbody>
<tr align="left">
<td align="left" width="15%"><img src="/images/369/images/content_image.png"><br><br><br><br></td>
<td style="background: transparent url(/panel.png) no-repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; vertical-align: middle; text-align: center;" align="left" width="70%"><h2 style="font-family: Arial;"><font color="#0088ce" size="6">Project Initiative</font></h2><h1 style="font-family: Arial; text-align: center;"><font size="3" face="Arial">TEXT HERE</i>.</font></h1><br><br></td>
</tr></tbody></table>

Hi,

I am working for support and got one issue raised..
My webpage has 3 print blocks .. when i minimize the browser the alignment of third block remains same and hence I good horizontal space bar for that while other two blocks align/resize themselves according to new page size..

Kindly suggest which tag /etc i need to check

I am having an alignment issue with a row of images. The site is located he http://www.teewala.com/teewala

I cannot figure out why the three images are shifted slightly to the right. The code is very simple, so I figure the solution should be simple. Any help is greatly appreciated.

Thanks!

Having an issue with page positioning and alignment. My html skills are limited at best but Im trying to set up a layout template for my ebay sales.

what I want is for the page/table to have fixed borders so that the horizontal scroll bar at the bottom doesn't' appear as I enter large amounts of text, instead I'd like to have it expand downwards to accommodate whatever I enter instead of expanding outwards to the right as its currently doing.

I realize the code may be a bit of a mess, but Im seriously stuck,
I've messed with all the tags but I can't seem to figure out what is causing this problem, any tips at all from anyone would be much appreciated.


link to layout
http://surrenderyourwings.com/layout.html

When you go to my site www.sforu.com with IE 6 or IE7 the picture is all misaligned,
So could you take a look and let me know whats wrong with it, because it's driving me crazy


Thank you

Hello, I realize several threads have already been posted and that many of you dislike tables. I am having, however, a table issue that I think is only solvable through HTML adjustment of said table. In FF and IE8, my homepage looks excellent, just how I've laid it out. However, in earlier versions of IE (which the majority of my demographic still use), the layout of the table is askew. The remainder of my page is made up of various Flash movies, and I have tested that these are not the cause of the layout issue. The 2-cell table I have is being thrown for a loop (laying itself out to the right and stretching the site), and I'm not sure what the cause of it is. It needs to be left-aligned; below is my code:

Code:

<table summary="main content panel" align="left" bgcolor="#ffffff" width="535">
<tbody>
<tr>
<td align="left" width="15%"><img src="/images/369/images/content_image.png"></td>
<td style="background: transparent url(/images/369/images/panel.png) no-repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; vertical-align: middle; text-align: center;" align="left" width="70%"><h2 style="font-family: Arial;"><font color="#0088ce" size="6">Project Initiative</font></h2><h1 style="font-family: Arial; text-align: center;"><font size="3" face="Arial">Valmont is currently conducting research on producing rice under mechanized irrigation in an effort to conserve water and energy, and increase profitability by bringing land into production, an initiative appropriately titled <i>Circles for Rice</i>.</font></h1></td>
</tr></tbody></table>

I'm unsure what the "scroll 0% 0%" through "-moz-initial;" is, the CMS I'm using has thrown that code in. (BTW - cannot get out of using CMS, which I would dearly love, this is a work project, so use what I'm given ) Here is why I think I still need to use a table: I need to be able to align two images (a photo and a border) but be able to insert text on top of the border. I had originally created this in Flash, but I totally spaced that I needed some text on the homepage so Google can index the text correctly. Is there another option to accomplish what I'm trying to do, one without tables? I appreciate all other options! Thanks!

Hi all, beginner question here.

I'm attempting at building a small website for my local golf club, one of the tabs on the page is a "Contact" link, inside this tab page I have attempted to embed a small GoogleMap with co-ordinates of the golf club. Whilst testing with IE7 the embedded GoogleMap appears randomly at the bottom of the page totally out of place where it should be. If browsing using Firefox, IE8 or Chrome it appears in the correct place, which is in the middle of the "Contact" page, and only when you click on the "Contact" tab.

I only seem to have this issue with IE7, all the other browsers I've tested so far it aligns perfectly (Firefox, IE8, Chrome).

As I say above, this issue only appears in IE7 - however I'm more than sure it is just a stupid mistake on my behalf, but I've tried and tried and can't seem to resolve it.

Appreciate any help anyone can offer - Many thanks in advance.

The website URL is: http://staging.boarsheadgolfcentre.co.uk/

The bit of code that handle the embedded map is:
Code:

<div class="box" id="contact_page">                    
                    <div class="m_table">
                    <table width="85%" align="left" cellpadding="20">
                        <tr>
                            <td>
                                <h1 align="left">Contact Us</h1>
                            </td>
                            <td rowspan="5">
                                <div id="map_canvas" style="border-style:solid; border-width:1px; float: right; width: 350px; height: 450px"></div>
                                <strong style='float:right;'><a href="http://maps.google.co.uk/maps?hl=en&expIds=17259,28023&xhr=t&cp=39&um=1&ie=UTF-8&q=Boars+Head+Golf+Centre+Ltd,+Crowborough&fb=1&gl=uk&hq=Boars+Head+Golf+Centre+Ltd,&hnear=Crowborough,+East+Sussex&cid=0,0,4613151939200773413&ei=y98ITfieOYO3hQelsojLDw&sa=X&oi=local_result&ct=image&resnum=2&sqi=2&ved=0CCUQnwIwAQ" style='text-decoration: none;'><font color=#000000>For a larger map click here</font></a></strong>
                            </td> 
                        </tr>
                        <tr>
                            <td>
                                <p style='border: none;'>
                                    <strong>Boars Head Golf Centre&nbsp;</strong><br />Boars Head, Crowborough, East Sussex, TN6 3HD&nbsp;<br /><br />
                                    <strong>General Manager:&nbsp;</strong>Peter Grenham<br /><strong>Telephone:&nbsp;</strong>01892 664 545<br /><br />
                                    <strong>Professional:&nbsp;</strong>Keith Robson<br /><strong>Assistant Professional:&nbsp;</strong>George Scott
                                </p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p style='border: none;'>
                                    <strong>Location/Description:</strong><br />
                                    Situated just outside Crowborough on the way to Tunbridge Wells on the B2157. Traveling from Crowborough Town turn right on the Boars Head roundabout and head back up the B2157 for about 100 yards, entrance on your left (signposted).<br />
                                    Parkland course with water and trees. 9 hole course, 2698 yards (5396 18 holes), S.S.S. 67 (18 holes).<br /> Practice facilities available (driving range, grass tee, putting green and chipping area).
                                </p>
                            </td>
                        </tr>
                    </table>

                    </div>
                    </div>

Code:

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAGSrquuMPubSa0rTVyaJ2-hRM3sC8BNhS4dKTfFraCAxHin8KOhRLTWtdRIc0Q2_nPROmXypLuvQBUw"
            type="text/javascript"></script>

    <script type="text/javascript">

        function initialize() {
            if (GBrowserIsCompatible()) {
                var map = new GMap2(document.getElementById("map_canvas"));
                var center = new GLatLng(51.065371, 0.183923);
                map.setCenter(center, 13);

                var marker = new GMarker(center, { draggable: false });

                GEvent.addListener(marker, "dragstart", function () {
                    map.closeInfoWindow();
                });

                GEvent.addListener(marker, "dragend", function () {
                    marker.openInfoWindowHtml("Just bouncing along...");
                });

                map.addOverlay(marker);
                GEvent.addListener(marker, "click", function () { marker.openInfoWindowHtml('Boars Head Golf Centre'); });

            }
        }
    </script>

This seems to be an oddity these days, but I have a problem with my website in Firefox though it works just fine in IE (6 or 7). The website displays correctly, but my form fields will not allow any text to be put in them. The weird thing is I have another website that uses the same formatting for the text fields and they work fine...

Code for the form that works in IE and not Firefox is as follows:
<div align="right">
<form method="post" action="test/login.asp" name="LoginForm">
<input name="action" value="login" type="hidden" />
<table>
<tr>
<td><label>Username:</label></td><td><input name="UserName" /></td>
</tr>
<tr>
<td><label>Password:</label></td><td><input name="Password" type="password" /></td>
</tr>
</table>
<button name="LoginBtn">Login</button><br />
</form>
</div>

Code for the form that works in both is as follows:
<div id="layer3">
<h2>Client Login Form</h2>
<form method="post" action="users/login.asp" name="Login">
<table>
<tr>
<td><label>Username:</label></td><td><input name="UserName" /></td>
</tr>
<tr>
<td><label>Password:</label></td><td><input name="Password" type="password" /></td>
</tr>
</table>
<button name="LoginBtn">Login</button><br />
</form>
</div>

Both forms are inside <div> tags, both are on pages that use frames. Let me know if there's something I'm missing...

Chris

http://vedaherbalhealth.com/

below header the sidebar text is not clickable in Firefox but working fine in IE. Can any one help me please.

thanks
K

My new website MoveBR.com isn't rendering correctly in Firefox, but it seems to be working fine in IE. Specifically the picture on the left is messing up the footer. Just the page I've linked to though...it's a test page to get this working on others. It seems to do this whether the picture is inside the content or in its own div.

And if anyone is using Safari, I'd appreciate it if you could tell me how it looks there too.