Surface Pro (2017) vs Surface Pro 4
I'm fairly new and self taught so forgive me if this is glaringly obvious.
This is what my layout is meant to look like: click here
and this is what it looks like when I put a spry validated form in the editable region:
The style sheet can be found found here:
The pages are created from the same template with the same style-sheet attached so I can't work out why the page would shift bits. I have another page with a form which is also affected the same so assume that its an issue with the form itself.
Any help is much appreciated and I would be grateful for any other feedback about the page design.
Right i tried that and in doing so realised that the closing div tag for #mainbody was in the wrong place. I had to add 10px to the top padding so the text didn't sit too close to the top border.
Problem still persists though. I have updated the CSS file so if you could have another look and see if there is anything else that'd be great.
It's working OK for me in Firefox 3.6.13 and in IE8 (and in compatibility view). Where do you see a problem?
Im also using IE8. At the bottom of the large white text area i have an image to give the impression of curved edges. On the pages with the forms this image has shifted to the right and out of line.
Also I have an image which is supposed to be repeated along the x axis at the footer but this has been cropped from both sides.
It looks fine in dreamweaver until its previewed in a browser.
If you have changed code your end and its working could you post it so I can check against my own.
Thanks for your help.
The div "rightpanlower" is within the form. It should be outside and within the next div.
You have the code:
I think that this should be:
i'm not sure where you have got that code from. the form is within the editable region of 'rightpan' and 'rightpanlower' is after the form and 'rightpan' closing tags.
The positioning of 'rightpanlower' is controlled within the template page and is not editable at all from any of the pages on my site. This is why i can't work out why it looks fine on pages that don't have a form in them and off centre in those that do.
Maybe ive done something in the style sheet that defines a form badly and this is what is causing a conflict. im sure it has something to do with the form coding.
thanks for all your help.
Re. the bottom image:
The div "footerMain" is inside the "mainBody" for the Contact page and outside for the page that works correctly.
The code I posted is from the HTML code of your page. I don't know how your template works, but can assure you that the code is as I have shown. If the structure is set in the template, I cannot understand how it is different between the two pages. Can you not edit the HTML code directly for the Contact page?
Could it be a problem caused by the position, in the template, where you are inserting the form?
The form seems to wrap around the 'rightpanlower' div.
I've just had another look. I saved the page, using Firefox, in order to work on it. This did in fact change the code. This was probably in order to rationalise a problem with the code.
The problem seems to be that you have included the 'rightpanlower' div in the 'rightpantext' div, rather than in the 'rightPan' (ie on the same level as the 'rightpantext' div.
I will look into the bottom picture problem again.
The problem is as I have posted:
"The div "footerMain" is inside the "mainBody" for the Contact page and outside for the page that works correctly."
This thread is now locked and can not be replied to.