Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Review Script alignment CSS problems with IE

Featured Replies

Hope someone can help as support for this script I have purchased is really very poor....

 

Please visit travelvaluereviews.co.uk in Firefox, opera, safari and you shall see the web page is centered, what ever the screen size / width. Now please look at the same site in internet explorer... YOU SHALL SEE THE PROBLEM!!!!

 

I have tried numerous CSS controls to change the way the page is aligned but all fail in IE and some fail in the other browsers, the most browser compatible way i have found is as the CSS below, and this just fails with IE.

 

Please help if you got any ideas, could it be to do with the java script form overlays (for example of overlays click on join in >> top left)

CSS copied from css default file

 

/* Main Body */

 

html,body {

height:100%;

width:900px;

text-align:center;

margin-left:auto;

margin-right:auto;

margin-top:30px;

margin-bottom:20px;

}

 

body {

background-image:url(../images/site_bg.gif);

background-repeat:repeat;

background-color:#fff;

color:#212121;

font:83%/1.4 arial, helvetica, sans-serif;

margin:0 auto;

padding:0;

}

 

 

/* Top Header */

 

#banner {

background:#DD2121;

border-bottom:0 solid #A72525;

height:120px;

background-image:url(../images/headbg.jpg);

background-repeat:no-repeat;

padding:0;

 

 

Thanks for all who comment

  • Author
Check out this thread.

 

Thanks Andy for your quick reply the CSS you suggest at the topic you sent me to does not seem to work.

 

 

I placed this CSS below at the top of my stylesheet and left everything else remaining as it previously was, and still no joy in IE

 

body { text-align:center; position:absolute; height:100.1%; width:100%; }

body div { text-align:left; }

 

Any further ideas? once put the CSS above into the stylesheet should I remove any of the other CSS controls that were previously there?

 

Thanks

You need to wrap your whole page in a div, and then put the margin auto thing onto that div. E.g.:

 

#page { width:900px; margin:0 auto; }

 

<body>
<div id="page">

(everything on your page)

</div>
</body>

And put the new body css code (in your post above) after your original body tags.

 

Your entire CSS could then do with being optimised a bit to remove redundant tags, but this should work I think. The key is that putting the extra CSS trickery on the body means that the margin auto trick will work on elements inside the body (not the body itself).

  • Author

Thanks again Andy for your continued support, I have tried what you have suggested in various ways - unfortunately none of which bringing me any joy! Its probably just me cos I am not that experienced.

 

It would really help me if you could actually make the small changes, I have attached the default css file and also the index.php which I suppose is the file that must be wrapped in the div.

 

Pls help if you have time, and if not then i shall play around some more.

 

Thanks and Regards

index.php

default.css

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.