Skip navigation
deleteproductions
deleteproductions Calculating status...
Currently Being Moderated

How to make a div less heigth with more content.

Sep 16, 2012 12:20 PM

Hi,

 

like in the video tuturial "using the css transition panel" i want to downsize my div's (heigth) and make them bigger if the transition is applied. But when i try to do it my background color is smaller and the transition works but the content is till show, even on top of the div's underneath them.

 

See: deleteproductions.nl

 

Please help. I tried everything i geussed would do it.

 

Greets,

 

Fabian

1124 Views   17 Replies   Latest reply: deleteproductions, Sep 17, 2012 12:19 PM
 
Replies
  • Nancy O.
    Currently Being Moderated
    1. Nancy O.,
    Sep 16, 2012 12:47 PM   in reply to deleteproductions
    Report

    That page is enormous!!   I use a 1280 display and even zoomed out all the way (Ctrl+----), I still can't see everything on your page because it won't fit in my display.

     

    As an example, your logo image http://deleteproductions.nl/logos/logo_notel.png

    is 1,969px wide.  And your menu...  Oh my gosh!

     

    Average desktop/laptop users need pages that fit inside a 1000px wide viewport.  Your first priority should be to rescale everything and re-design your layout.  Worry about CSS Transitions later.

     

     

     

    Nancy O.

     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    2. deleteproductions,
    Sep 16, 2012 12:52 PM   in reply to Nancy O.
    Report

    The page is based on an fluid grid layout. So it should be fine when the browser is set to 100%. In my case it works fine on safari and ios (ipad and iphone). I had problems with that before but that has been solved.

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    3. Nancy O.,
    Sep 16, 2012 1:12 PM   in reply to deleteproductions
    Report

    Try viewing it on a desktop or laptop.  It's a train wreck.

     

     

    Nancy O.

     
    |
    Mark as:
  • mytaxsite.co.uk
    Currently Being Moderated
    4. mytaxsite.co.uk,
    Sep 16, 2012 1:47 PM   in reply to Nancy O.
    Report

    Try viewing it on a desktop or laptop.  It's a train wreck.

     

     

     

     

    In other words:

     

    "Probeer het bekijken daarvan op een desktop of laptop. Het is een trein wrak."

     


     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    5. deleteproductions,
    Sep 17, 2012 8:45 AM   in reply to Nancy O.
    Report

    On my laptop, (10", windows 7 starter, ie) the site works fine, not very fast but fine. The fluid grid is able to do what i want it to do.

     

    So i dont know on what os and browser you think it is an trainwreck but in ky cases it works perfect.

     

    Btw i do not need an translation, i can do it better myself.

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    6. Nancy O.,
    Sep 17, 2012 10:32 AM   in reply to deleteproductions
    Report

    Screenshot from Win, Firefox on a 1280px wide display.

    DeleteProd.jpg

    Screenshot from Internet Explorer

    DeleteProd1.jpg

     

     

    Nancy O.

     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    7. deleteproductions,
    Sep 17, 2012 10:35 AM   in reply to Nancy O.
    Report

    My screenshot and how it should be.

    file://localhost/Users/fabiandeleede/Desktop/Schermafbeelding%202012-0 9-17%20om%2019.33.15.png

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    8. Nancy O.,
    Sep 17, 2012 10:37 AM   in reply to deleteproductions
    Report

    Sorry.  We can't see files on your local hard drive.  You would need to save the screenshot locally and insert it into the web forum using the camera icon.

     

     

    Nancy O.

     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    9. deleteproductions,
    Sep 17, 2012 10:38 AM   in reply to Nancy O.
    Report

    i tried to edit it but i wasn't able to.

    tis is it:Schermafbeelding 2012-09-17 om 19.33.15.png

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,731 posts
    Oct 15, 2010
    Currently Being Moderated
    10. Sudarshan Thiagarajan,
    Sep 17, 2012 10:54 AM   in reply to deleteproductions
    Report

    Two words: Bad practice. Having BIG images, guzzling your users bandwidth and letting Fluid Grid do the resizing even for your images. Secondly, not wanting to understanding/ adapt to best practices used to make Fluid Grid Layouts.

     

    Honestly, take it any which way you want - but if I'm an user to your website, I'd do one thing as soon as I visit your page. Hit the 'close' button.

     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    11. deleteproductions,
    Sep 17, 2012 11:01 AM   in reply to Sudarshan Thiagarajan
    Report

    First of all:

    What is wrong with big pictures. They are smaller the they were before because ios didn't recognise them (i aslo used this forum and it helped me much).

    Secondly:

    why not simply telling me what to do? you are now just annoying me because i do this for the first time in my life and it looks great on every pc i tested it on yet.

     

    So:

     

    Do you know the answer or not? If you do please tell me, i would appreciate it very much.

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    12. Nancy O.,
    Sep 17, 2012 11:16 AM   in reply to deleteproductions
    Report

    We all started in the same place.  You must crawl before you walk.

     

    Start over. Learn from your mistakes.  Rescale images and layout to fit on an average desktop/laptop without horizontal scrollbars.  Width: 1000px.

     

    Forget about Fluid Grids & CSS Transitions until you have a much better understanding of basic CSS Layouts.

     

    Creating  your first web site-

    http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt1.htm l

     

    DW Starter Pages --

    http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_l ayouts.html

     

    After you have built 3 or 4 websites, then you will be ready to try advanced CSS methods with media queries and transitions. 

     

     

    Nancy O.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,731 posts
    Oct 15, 2010
    Currently Being Moderated
    13. Sudarshan Thiagarajan,
    Sep 17, 2012 11:24 AM   in reply to Nancy O.
    Report

    Nancy O. wrote:

     

    We all started in the same place.  You must crawl before you walk.

     

    Start over. Learn from your mistakes.

    A great post to make it your 13,000th!

     
    |
    Mark as:
  • John Waller
    Currently Being Moderated
    14. John Waller,
    Sep 17, 2012 11:54 AM   in reply to Sudarshan Thiagarajan
    Report

    I wouldn't trust these Adobe post count stats. They're inaccurate for those who came from the Macromedia forums. They only work if you started new on these Jive forums.

     

    Much was lost when Adobe imported the data from the Macromedia forums into these Jive forums.

     

    Mine was reset to zero after 10 years of posting. Others were imported intact. Even the date I joined as displayed here under my avatar is wrong.

     

    Nancy has probably posted 113,000 times.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    3,731 posts
    Oct 15, 2010
    Currently Being Moderated
    15. Sudarshan Thiagarajan,
    Sep 17, 2012 11:55 AM   in reply to John Waller
    Report

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    16. Nancy O.,
    Sep 17, 2012 12:14 PM   in reply to John Waller
    Report
    Nancy has probably posted 113,000 times.

    OMG!   I need to get out and play more golf.

     

     

    N

     
    |
    Mark as:
  • deleteproductions
    Currently Being Moderated
    17. deleteproductions,
    Sep 17, 2012 12:19 PM   in reply to Nancy O.
    Report

    ADMIN: Please lock topic. It's no longer any use for anyone.

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points