User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 397,836 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,563 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 606 | Replies: 7
Reply
Join Date: Oct 2007
Posts: 174
Reputation: Venom Rush is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 2
Venom Rush's Avatar
Venom Rush Venom Rush is offline Offline
Junior Poster

Hiding half shown content in a div with the overflow property

  #1  
Jun 18th, 2008
Hi everyone

I have a table inside a div. The div has the overflow property set to auto and a height specified. At the moment when some of my pages load, the copy inside the div is peeking at the bottom. Is there any way to not show it? I've tried the clip property but I've found that it doesn't work when overflow is set.

Any help would be greatly appreciated
This user has a spatula. We don't know why, but we are afraid.
AddThis Social Bookmark Button
Reply With Quote  
Join Date: May 2008
Location: Hyderabad, India
Posts: 248
Reputation: sreein1986 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 27
sreein1986's Avatar
sreein1986 sreein1986 is offline Offline
Posting Whiz in Training

Re: Hiding half shown content in a div with the overflow property

  #2  
Jun 18th, 2008
I didn't get what are you saying please post your query with also code
Thanx,
Sreekanth

www.saap.in
if you problem solved add me as a reputation and mark it mark as solved
Reply With Quote  
Join Date: Oct 2007
Posts: 174
Reputation: Venom Rush is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 2
Venom Rush's Avatar
Venom Rush Venom Rush is offline Offline
Junior Poster

Re: Hiding half shown content in a div with the overflow property

  #3  
Jun 18th, 2008
This is what I have. What happens on some pages with this structure is that the text is half shown at the bottom of the div. What I would like to know is if it's possible to hide that text until someone scrolls down.
  1. <div class="contentOverflow">
  2. <table height="360" width="100%" border="0" cellspacing="0" cellpadding="0">
  3. <tr>
  4. <td class="content" align="left" valign="top">
  5. <p>This is copy that goes deeper than 360 pixels. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum lacus enim, suscipit eu, eleifend a, feugiat sodales, mauris. Duis vel est. Quisque consequat rhoncus neque. Nunc a ipsum. Duis ut justo. Pellentesque mattis, mauris nec ullamcorper ornare, felis quam condimentum mi, nec dictum massa sapien a lorem. Maecenas leo neque, dapibus sit amet, commodo quis, vulputate vitae, felis. Donec vitae dui. Aliquam quis dui. Morbi eget dolor. Quisque varius. Maecenas arcu. Sed mollis tincidunt sem. Nunc id massa. Aliquam erat volutpat. Vestibulum purus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec ante metus, tempus eget, imperdiet id, accumsan vel, enim. Nam lorem elit, eleifend vitae, lacinia ut, varius eget, magna. Etiam lobortis est nec sem.
  6.  
  7. Aenean a lectus. Nullam ultricies. Aenean fermentum iaculis tellus. Etiam gravida, felis at pharetra vulputate, quam sem faucibus dolor, sed tristique dui nulla pharetra diam. Vestibulum iaculis accumsan odio. Nullam lorem. Nam accumsan nunc non felis. Suspendisse nulla mi, dignissim ac, ultricies quis, aliquam ut, mauris. Integer malesuada. In malesuada enim in libero. Mauris ultricies dolor eu mauris. Nullam faucibus feugiat velit. Maecenas ante eros, egestas a, euismod quis, lobortis non, dui. Morbi malesuada turpis at libero. Aenean elementum. Aenean pede pede, dapibus quis, congue a, volutpat a, odio. Cras tortor eros, ullamcorper a, luctus imperdiet, convallis adipiscing, sem. </p></td>
  8. </tr>
  9. </table>
  10. </div>
  1. .contentOverflow {
  2. height:360;
  3. overflow:auto;
  4. /*clip:rect(30px, 0, 30px, 0);*/
  5. }
  6. .content {
  7. background-color:#FFFFFF;
  8. padding:30px 50px 30px 50px;
  9. }
This user has a spatula. We don't know why, but we are afraid.
Reply With Quote  
Join Date: May 2008
Location: Hyderabad, India
Posts: 248
Reputation: sreein1986 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 27
sreein1986's Avatar
sreein1986 sreein1986 is offline Offline
Posting Whiz in Training

Re: Hiding half shown content in a div with the overflow property

  #4  
Jun 18th, 2008
In my IE and firefox it's came clearly
I think its depends on screen resolution, change your screen resolution to 1024*760
or 1280*800 ...
Thanx,
Sreekanth

www.saap.in
if you problem solved add me as a reputation and mark it mark as solved
Reply With Quote  
Join Date: Oct 2007
Posts: 174
Reputation: Venom Rush is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 2
Venom Rush's Avatar
Venom Rush Venom Rush is offline Offline
Junior Poster

Re: Hiding half shown content in a div with the overflow property

  #5  
Jun 18th, 2008
The website is going to be viewed by the general public. I was hoping there might be a solution that would work for everyone. Thanks for your effort though sreein
This user has a spatula. We don't know why, but we are afraid.
Reply With Quote  
Join Date: Jan 2007
Posts: 2,524
Reputation: MidiMagic is on a distinguished road 
Rep Power: 7
Solved Threads: 105
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Posting Maven

Re: Hiding half shown content in a div with the overflow property

  #6  
Jun 19th, 2008
The problem is in the fluid nature of div. It doesn't always obey the height and width properties, unless forced to by surrounding objects. It "thinks" displaying the content is more important than the defined size.
Daylight-saving time uses more gasoline
Reply With Quote  
Join Date: Oct 2007
Posts: 174
Reputation: Venom Rush is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 2
Venom Rush's Avatar
Venom Rush Venom Rush is offline Offline
Junior Poster

Re: Hiding half shown content in a div with the overflow property

  #7  
Jun 20th, 2008
Originally Posted by MidiMagic View Post
The problem is in the fluid nature of div. It doesn't always obey the height and width properties, unless forced to by surrounding objects. It "thinks" displaying the content is more important than the defined size.


Ok, if that's the case then surely it would show an entire sentence instead of just the top half of every word???
This user has a spatula. We don't know why, but we are afraid.
Reply With Quote  
Join Date: Jan 2007
Posts: 2,524
Reputation: MidiMagic is on a distinguished road 
Rep Power: 7
Solved Threads: 105
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Posting Maven

Re: Hiding half shown content in a div with the overflow property

  #8  
Jun 27th, 2008
OH!

I thought it was cutting off the last half of the text string.

This is a problem of the div or the line being smaller than the space needed to render the text.

Check your styles for the following:

- A height too small to contain the text and its surrounding styles.

- A font size smaller than the smallest size the displayed font can display in.

- The height of the container not being an integer multiple of the height of the text.

Also check to see if the browser is substituting font sizes. Remember that users can change font sizes with a menu setting when they view your page.

Maybe the spatula has something to do with it.
Last edited by MidiMagic : Jun 27th, 2008 at 11:51 pm.
Daylight-saving time uses more gasoline
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

DaniWeb HTML and CSS Marketplace
Thread Tools Display Modes

Other Threads in the HTML and CSS Forum

All times are GMT -4. The time now is 7:37 am.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC