Author Topic: Website with transparant css menu  (Read 3477 times)

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Website with transparant css menu
« on: December 10, 2009, 10:22:54 AM »
Hi,

Here's one for you: website.
I've build this website for over a year ago.

This website sells custom made baby things. It's colorfull and the (sub)menu is css transparant.

Boudi
...:: Bake the Unbakable ::...

Offline pcwacht

  • Posts: 2923
  • Gender: Male
    • Dutch ICT info
Re: Website with transparant css menu
« Reply #1 on: December 10, 2009, 03:47:55 PM »
Very colorfull indeed

Saw tiny problem in the page 'Styling', in ie7 and Firefox 3.5 on windows xp there comes a white bar at the top of the page. This happens only at that page.



John
http://www.ictwacht.nl = Dutch ICT info
http://www.pcwacht.nl = My first
both still work in progress, since years.....

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #2 on: December 10, 2009, 04:01:12 PM »
Strange behaviour.

Anyway, Deleted the page. Re-created it and now it's fine.

Thnq for noticing :)
...:: Bake the Unbakable ::...

Offline Vincent

  • Posts: 376
  • Gender: Male
    • websites voor ondernemers
Re: Website with transparant css menu
« Reply #3 on: December 10, 2009, 04:08:45 PM »
Looks like you made it for big screens (1280): on a 'normal' 1024 reslolution I get a scroll bar and cannot read all the texts. Could easily be fixed.

Regards,
Vincent

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #4 on: December 10, 2009, 04:14:49 PM »
Hi Vincent,

Quote
I get a scroll bar

Vertical or horizontal?
...:: Bake the Unbakable ::...

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Website with transparant css menu
« Reply #5 on: December 10, 2009, 10:35:24 PM »
I don't see a scrollbar on 1024, but the site is not centered. It's aligned at the right. Not like it is supposed to be I guess...
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #6 on: December 10, 2009, 10:54:41 PM »
Quote
but the site is not centered

Well, actually it is, but it's made for bigger screens. However, I will check If I can make it more suitable for smaller (1024) screens.

Thnq anyway for noticing :)
...:: Bake the Unbakable ::...

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Website with transparant css menu
« Reply #7 on: December 10, 2009, 11:08:45 PM »
Quote
but the site is not centered

Well, actually it is, but it's made for bigger screens. However, I will check If I can make it more suitable for smaller (1024) screens.

You can create it for bigger screens, and still center it even on 1024px. Your content fits on 1024, so it can be centered on that resolution as well. For example on http://www.interactadvies.nl/ I used a very wide background, but the content fits centered on a 1024 resolution as well.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #8 on: December 10, 2009, 11:20:41 PM »
This website contains 2 transparent images on both sides. (therefore it's rather wide)
When you adjust the screen you wiil see the website float over the background.

But as you said, it could be better. So I will take a new look at it. Thnx for the hint :)

...:: Bake the Unbakable ::...

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Website with transparant css menu
« Reply #9 on: December 10, 2009, 11:32:14 PM »
Just use 1 centered background image on background color and let the centered site float on top.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #10 on: December 10, 2009, 11:42:04 PM »
You are very right. But that's already the case with this site.

The difference is that the complete site is over 1300 px in width. Reason: both sides (left & right) do have a fading transparant image of 200px each that glides over the flower background. When your screen is wide enough you see what I mean :)

...:: Bake the Unbakable ::...

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Website with transparant css menu
« Reply #11 on: December 10, 2009, 11:51:20 PM »
I am a poor 1024 screen user  :cry:
But I took my widescreen laptop and saw what you mean. Sorry, I didn't understand you well.

Solution: multiple containers, each one with a transparent background. You can also give html and body tags a background, did you know that?
« Last Edit: December 10, 2009, 11:52:58 PM by Argos »
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Boudi

  • Global Moderator
  • *****
  • Posts: 1190
  • Gender: Male
  • //o_-\\
    • Yze Webdesign
Re: Website with transparant css menu
« Reply #12 on: December 11, 2009, 12:00:43 AM »
No problem :)

Yes, you are right, and I must not forget this site was build over a year ago. Now I look at it again and there are some minor things that could be ready for improvement. And those transparent sidebars are one of them.

I will check them tomorrow. Now I will catch some zzzleeppp.

Thnx for the advice. Appreciate it :)

Boudi

...:: Bake the Unbakable ::...

 

postern-length