13 replies [Last post]
Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

Hi all,

Haven`t finished it yet, but if there`s anything I`ve missed or could improve on the pages I have....

http://www.mandyleigh.com/v3/

completely done in CSS. I`m in the process of doing the `pics` pages atm, and am experimenting with putting a php pic gallery up (singapore).... except I don`t know how to do that yet Smile

Will also add a paypal thing to the first `music` page.

looks alright in IE6 so far.... what`s it like in recent Netscape`s and Opera, or whatever popular browsers there are?

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 18 years 40 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

interim site check pls...

Very nice site

You may want to think about preloading the hover images for the links. It stops the delay when a new viewer puts mouse over links.

A little trick I do is to show the hover images at 1px size, and hide it somewhere like negative margined out to the left of the screen. The point is the Browser loads the image when the page is opened.

Day

The only way to learn is to do it yourself

firstreflex
firstreflex's picture
Offline
Enthusiast
Brooklyn USA
Last seen: 15 years 24 weeks ago
Brooklyn USA
Timezone: GMT-5
Joined: 2003-10-21
Posts: 104
Points: 0

interim site check pls...

It's not working in IE5, Opera or Gecko browsers. boxright is displaying below boxleft.

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

Daybreak_0 wrote:

You may want to think about preloading the hover images for the links. It stops the delay when a new viewer puts mouse over links.

A little trick I do is to show the hover images at 1px size, and hide it somewhere like negative margined out to the left of the screen. The point is the Browser loads the image when the page is opened.

Day

Thanks Smile That sounds like a great idea Smile Do you have any code for me to look at?

Cheers.

<edit>
I`ve found a great link to hel pme out on that...
http://www.redmelon.net/tstme/roll/

I`m a bit stumped on how to change my stuff into what it`s displacement method is though... hmmmm.

any tips on what hacks to use to make IE5 and Opera happy bunny`s?

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 23 hours 16 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

interim site check pls...

Hi Stormz,
The problem with the box dropping in most browsers other then IE is caused by the widths of the boxleft and boxright not quite fitting into boxall.
IE in quirks mode renders the box model very differently to other browsers.
First thing I would do is change the doctype to

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

You would have to make sure all your tags tags are closed like "<br />"

Once the doctype is changed the box may drop down in IE as well as the other browsers. It will then be easy to fix by adjusting the widths and margins of the inner boxes.
You wont need any hacks.

Also you should put a title in the head of the document.

Hope that helps.

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

cheers Tony, I`ll try that asap.

What`s the / mean btw?

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 23 hours 16 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

interim site check pls...

Hi Stormz,
In XHTML you need to all tags, so to closes tag that used to not require and end tag in HTML you can use " />" at the end of the tag.

<input name="test" id="test" />
<br /> <img src="some.gif" />

Hope that helps

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 18 years 40 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

interim site check pls...

Check this page for the hacks to fix box sizes

http://css-discuss.incutio.com/?page=BoxModelHack

heres another useful link
http://css-discuss.incutio.com/?page=CssHacks

Day

The only way to learn is to do it yourself

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

Cheers for the links Tony. Will try and get my head around it soon. Brain-Strain Smile

I`ve uploaded a bunch of `download mp3` buttons on the music pages. Could you give tell me which you guys think is the best one to use please (just tell me which page it`s on)... cheers.

Sven
Sven's picture
Offline
Enthusiast
Brisbane, Australia
Last seen: 15 years 10 weeks ago
Brisbane, Australia
Timezone: GMT+10
Joined: 2003-03-12
Posts: 166
Points: 0

interim site check pls...

The 'download mp3' buttons, being so long and rectangular, have a kind of banner-ad feel to them (for me, at least). Maybe some sort of icon-style, square or circular button would be worth trying?

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

I tried that approach first... but just didn`t look right to me. The wider ones balance the page out better and still stand out without being too distracting. I`m thinking either the blue, purple or one of the orange ones would be best. The ones with the flowers were intial versions which I didn`t like but put them up in case hundreds of others thought they were the best.

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

site is up live now at http://www.mandyleigh.com

still have to finish a couple of things off, inc the box-model hack for Netscape/whatever and figure out the rollovers.

Stormz
Offline
Regular
Last seen: 18 years 40 weeks ago
Joined: 2003-11-11
Posts: 12
Points: 0

interim site check pls...

I`ve eventually gotten around to trying the ie5.5 hack on the website
http://www.mandyleigh.com ....

/* box model hack for ie5.5 */
div {
border: 0px;
padding: 0px;
}

@media tty {
i{content:"\";/*" "*/}} @import 'midpassbefore.css'; /*";}
}/* */

div {
width: 331px;
}

@media tty {
i{content:"\";/*" "*/}} @import 'midpassafter.css'; /*";}
}/* */
/* end box model hack for ie5.5 */

I`ve had to adjust the div width and that is as far as I can go without the boxright going under the boxleft..... but my right corners aren`t on the right anymore.... about 20px to the left. I`ll see if I can upload a screenshot..... http://www.mandyleigh.com/css_hack1.jpg

I did the midpassfilter.css like this:

div {
width: 760px;
}

but who knows what that looks like. I`m assuming that`s for the IE5.5 browsers.

cmose
Offline
Regular
Last seen: 18 years 37 weeks ago
Joined: 2003-12-05
Posts: 14
Points: 0

interim site check pls...

hey stormz, just to let you know
things appear a bit off in mozilla firebird -
Your News div is on the left but it's partially under the nav links (the home link covers the News title).
The box that provides your bio/info is below the news div and covers your footer.
I haven't had time to look at your style sheet yet but it *looks* like a width issue, e.g., news and rounded content box are wider then their parent div or something of the sort.

other then that, nice site!