Skip to content
View in the app

A better way to browse. Learn more.

MSFN

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.

CSS..

Featured Replies

Hey guys i have a small CSS issue that is kind doin my head in lol, ok i was designing a lil template for a whois script and the "Start Search" button i can't seem to get in the right place on firefox, in IE works fine (Haven't tried other browsers).

You can see what i mean here:

http://i-flex.us/webtools/whois/index.php

Firefox throws the button down to the left hand corner while it fits fine in IE:

Here is the CSS:

/* CSS Document */

body { font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#333333; }

a { color:#CC0000; text-decoration:none; }
a:hover { color:#666666; text-decoration:underline; }

#container { width:734px; margin:auto; }

#header { height:60px; padding:7px; }
#content { margin:auto; width:734px; }
#footer { padding:4px 10px 2px 10px; color:#666666; font-size:12px; }

#lookup { background: url(../../images/acewhois-02.gif) no-repeat top left; position:relative; margin-bottom:10px; width:734px; height:80px; }
#lookup h1 { position:absolute; top:12px; margin:0px; padding:0px; left:10px; font-size:14px; font-weight:bold; color:#7f7a7a; letter-spacing:-1px; background:none; }
#search_for { width:553px; position:absolute; left:12px; bottom:12px; border:none; font-size:16px; padding:3px; }

#go_search { position:absolute; width:142px; height:34px; right:10px; bottom:9px; background: transparent url(../../images/acewhois_button.gif); border:none; cursor:pointer;}
#go_search:hover { background:url(../../images/acewhois_button_on.gif); }

#result { clear:both; background: url(../../images/acewhois-03.gif) top no-repeat; padding-top:7px; }
#result_content { border-left:1px solid #d2d2d2; border-right:1px solid #d2d2d2; padding:5px 10px 5px 10px; }
#result_bottom { background:url(../../images/acewhois-04.gif) no-repeat top left; width:734px; height:10px; }

h1 { color:#EC0034; text-transform:uppercase; background:url(../../images/acewhois_div.gif) bottom repeat-x; padding:0px 0px 3px 0px; margin:0px 0px 5px 0px; font-size:12px; }

.smalltext
{
font-size:10px;
}

It seems to be this line thats causing the problem:

#go_search { position:absolute; width:142px; height:34px; right:10px; bottom:9px; background: transparent

Thanks in advance

Well i checked the page with opera,firefox and ie.

in firefox yeah the search button goes to bottom right of the page.dont know why though but in opera and ie it doesnt look too good neither:

1f696f0a8c.jpg

see? the right side of the search area is over the edge.and by the way im using 1280x1024 resolution.

and i hope you find the answer and let us know cause i have a similar problem with my website but in ie.

good luck.

  • 2 weeks later...
  • Author

Hi mate thanks for you reply, i still didn't find a solution for this im thinking of recoding it from scratch and see how it turns out! really annoying lol.

  • 2 weeks later...

I always have problems using absolute positioning with FF.

I get around that by using Margins & Padding in loads of Divs.

I would show you an example but my web host has done a runner so I have no website to show :P

  • 3 weeks later...

did you evolve all the divs on the site in a primary div to make use of all the screen resolution users have?

absolute positioning always works for me here, and instead of what you are doing, my reference is firefox to see if something works right or wrong. IE always screws up my codes.

Create an account or sign in to comment

Recently Browsing 0

  • No registered users viewing this page.

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.