Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

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 display issues, need urgent help

Featured Replies

Hi again everybody... This is kinda urgent.

 

I was fixing couple of link colors in my CSS then troubles appeared.

I have 2 problems. But the biggest problem is, I should launch the site TOMORROW according to the countdown I had a week ago.

I've attached the CSS file too.

 

First problem:

http://www.duettographics.com/items/5/Stoc...ions/Animals/1/

Thumbnails in the page over-lap covering the text under each thumbnail. Problem occurs in FF, but looks fine in IE, I guess it's cause IE gives little extra space between items.

 

Problem Two

http://www.duettographics.com/free-gallery/1/

In IE, thumbnails jump around the page almost randomly, they even move when i mouse-over to view the tool-tip preview, not to mention the PNG transparency problem at the bottom of the page (pagination place)

 

Please check the attached images and CSS file or visit the links to see the problem with your own eyes.

I hope these problems aren't serious, it's unfortunate that I'm still a CSS beginner.

 

Thank you in advance

style.css

post-8048-1226381449_thumb.jpg

post-8048-1226381483_thumb.jpg

  • Author

I managed to fix the first problem. I changed the element (.item) size, increased by 12 px

I hope someone give me an answer for problem two, since this has been happening for a while now that the thumbnails jump around like that.

is this fixed already? because in ie7+ff3 it works fine over here

it looks like it is specific to ie6 and if thats case I would try to reduce the padding on each li as ie6 has a habit of doubling up pixels on paddings and margins!

  • Author

@red-X I'm glad it works in IE7 and FF3 I hope to get it fixed on the rest of browsers.

 

@yusran Thank you ysuran for your advice, I reduced the indent to half but still nothing happened, they just changed positions.

 

Anyone with another idea?

hi again

 

sorry that didn't work - if it were me I think i would lay it out a little differently - at the moment you are relying on the browser to wrap in the right place and obviously as usual ie6 hasn't got a clue!!!

 

 

Why not create a <ul> element for each line that you have more control of what is on each line

 

cheers

 

Ysuran

Create an account or sign in to comment

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.