Abs. % positioning and scaleability for banner -need ideas for problem

How do I get the icons to stay in the yellow ‘windows’ when minimizing the screen size, as seen at http://www.demog.comuv.com ? This positioning works better for the smaller LinkedIn icon, but it doesn’t help with the general problem. Does anyone have any ideas as to how I could make this work? Thanks.

Hi NoVex. What you are doing there is really unreliable even on desktop browsers. When I opened your page, the icons were way off to the right, a long way from the boxes.

It’s never a good idea to attempt to align elements with a background image. It just doesn’t work. A better approach is to remove the yellow squares from the background image and keep them as a single, separate image (you only need one image, as they are all the same). Then give the anchors a width and height equal to the dimensions of the yellow square and place the square as a background image on each. That way, the icons can’t stray from the background square. You then need to center the icons within the anchor, which should be easy enough with padding or whatever.

The next issue is to position the anchors inside the header area. There are various ways to do that, but I would probably just float them. However, at the moment the background image on the banner doesn’t fit the banner container at wider screen widths, so it looks a bit rotten. On modern browsers, you can fix that with the background-size property. But you might be better off filling the banner area with a background color that visually extends the image left and right.

Good advice, thanks

No problem. :slight_smile: My tips weren’t very specific, so of course, if you need any clarification or help with your code, don’t hesitate to ask. :slight_smile:

That link flags up the bid Red Mcaffee warning for suspicious sites:

McAfee®, Inc.

Warning: Dangerous Site
Are you sure you want to go there?

http://www.demog.comuv.com/ may try to steal your information.

Why were you redirected to this page?

When we visited this site, we found it may be designed to trick you into submitting your financial or personal information to online scammers. This is a serious security threat which could lead to identity theft, financial losses or unauthorized use of your personal information.

More about 'phishing' attacks

Something you may want to sort out if you want visitors.:slight_smile:

Thanks. It’s a free domain and webhost I use just for testing purposes. I had a feeling it’s probably not that legit. Can you recommend any that are?

It’s probably a false positive from Mcafee but it doesn’t like free hosts much as they are always trying to force something on you.

@ralph_m may have a few suggestions for free hosts as I’ve been with the same paid host for 15 years so haven’t shopped around.:slight_smile:

I’ve never used free hosting, either, but there have been a number of threads on the subject in the Web Hosting and Domains forum. You could try [URL=“http://www.sitepoint.com/forums/showthread.php?1031110-Suggestions-for-free-hosting-sites”]this thread for a start - it includes links to several others.

Not free hosts. You can get decent hosting for as little as a few dollars per month, so I would never recommend free hosting. I’d rather forego a cappuccino once per month to avoid the misery of free hosting and all that comes with it.