Old 23-02-2006, 21:59   #1 (permalink)
pat
dilaudid
 
pat's Avatar
 
Join Date: Aug 2004
Location: Nelson, B.C. Canada
Posts: 9,316
Send a message via MSN to pat Send a message via Skype™ to pat
IE cock up

http://www.2605.co.uk/

In Firefox, it displays exactly as i want it to, with the links one beneath the other with hardly any leading.

In internet explorer, the links are all spaced out.

Any ideas how to rectify?
__________________
I'm a chutney farmer
  Reply With Quote
Old 23-02-2006, 22:08   #2 (permalink)
smallbeer
I Ain't Losing Any Sleep™
 
Join Date: Apr 2003
Posts: 5,142
Quote:
Originally Posted by sheepy
* {
padding: 0px;
margin: 0px;
}

that might do it?

fuck me, is that the answer to all lifes little mysteries this week? did you actually look at the code or just take a stab at it?

Pat,

it's <br /> not </br>

headings (h2, h3 etc) are block elements so don't need a line break to start a new line.

you might want to also think about using a list to display your list of links.

<ul>
<li><a href="#">whatever 1</a></li>
<li><a href="#">whatever 2</a></li>
<li><a href="#">blah blah</a></li>
<li><a href="#">fucking blah</a></li>
</ul>

If you don't want the bullets....

ul {
list-style: none;
}

or just carry on regardless.
  Reply With Quote
Old 23-02-2006, 22:43   #3 (permalink)
pat
dilaudid
 
pat's Avatar
 
Join Date: Aug 2004
Location: Nelson, B.C. Canada
Posts: 9,316
Send a message via MSN to pat Send a message via Skype™ to pat
That's top mate, cheers. I've lost my Web Standards solutions book so i'm feeling a bit lost.

If you have a look now, it's sticking the links over to the right - i've tried ading align:left; and padding-left: 0px; to both li and li a in my css, but that's not working.
__________________
I'm a chutney farmer
  Reply With Quote
Old 24-02-2006, 02:11   #4 (permalink)
pgo
Senior Member
 
Join Date: Jan 2005
Posts: 12,163
I've noticed when using lists sometimes IE spaces out the <li>s in an odd way. Try fudging the line-heights - 1em or .5em seem to do wonders for me. Sometimes, it's been a matter of margin-top: -3px; or something.

It's my practice to put all these "fixes" (even if they're not "hacks" per say) into an IE6 and lower stylesheet via conditional comments - <!--[if lte IE 6]><link blah blah /><[endif]--> - pretty sure I got the syntax down.
  Reply With Quote
Old 24-02-2006, 08:38   #5 (permalink)
smallbeer
I Ain't Losing Any Sleep™
 
Join Date: Apr 2003
Posts: 5,142
I've noticed a recurring theme recently where answers posted don't seem to be answering the questions asked. very odd.

Pat,

In IE unordered lists (ul) are given default left padding. In FF they are given default left margin. that's why it's "sticking the links over to the right".

There's lots of default values that you have to get used to. Headings (h1, h2 etc) are given default bottom margins in most browsers. I think in FF they're also given default top margins. confused yet?

The best thing to do is to reset all these defaults to zero before you start. Most people will tell you to do what sheepy does and reset everything using a *. example...

Code:
* { margin: 0; padding: 0; }

but for a beginner I'd recommend actually writing the individual inconsistent elements out in full, that way you know which ones we're talking about and which ones are being reset. Stick this at the top of you stylesheet.

Code:
html,body,p,blockquote,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input { margin: 0; padding: 0; }

use some/all of those in you page with and without the style attached and see the differences across browsers. what's the saying? Learn the rules so you know how to break them properly.

I'm coming over all hippy now.

Quote:
Originally Posted by pat
That's top mate, cheers. I've lost my Web Standards solutions book so i'm feeling a bit lost.

If you have a look now, it's sticking the links over to the right - i've tried ading align:left; and padding-left: 0px; to both li and li a in my css, but that's not working.
  Reply With Quote
Old 24-02-2006, 08:40   #6 (permalink)
Stickman
Dr. Lucien Sanchez
 
Stickman's Avatar
 
Join Date: Mar 2003
Location: UK
Posts: 5,498
Quote:
Originally Posted by sheepy
* {
padding: 0px;
margin: 0px;
}


that might do it?
It probably will.

If you want to take the indent out of the links, you can use that or:

Quote:
ul {
margin: 0;
padding: 0;
}
  Reply With Quote
Old 24-02-2006, 08:44   #7 (permalink)
smallbeer
I Ain't Losing Any Sleep™
 
Join Date: Apr 2003
Posts: 5,142
Quote:
Originally Posted by Stickman
It probably will.

but it wouldn't when pat's code look like

Code:
<h1>Inspiration (thanks)</h1> <h2><a href="http://www.harshpatel.com" target="_blank">Harsh Patel</a></h2></br> <h2><a href="http://www.grandpeople.org" target="_blank">Grandpeople</a></h2></br> <h2><a href="http://www.mmparis.com" target="_blank">M/M Paris</a></h2></br> <h2><a href="http://www.franklinvandiver.com" target="_blank">Franklin Van Diver</a></h2></br> <h2><a href="http://www.designerstalk.com" target="_blank">Designers Talk</a></h2></br> <h2><a href="http://www.newstoday.com" target="_blank">Newstoday</a></h2></br>
  Reply With Quote
Old 24-02-2006, 08:46   #8 (permalink)
Stickman
Dr. Lucien Sanchez
 
Stickman's Avatar
 
Join Date: Mar 2003
Location: UK
Posts: 5,498
I looked before I posted. It was fixed then, just needed default margin and padding off.

Sorry for interrupting the class.
  Reply With Quote
Old 24-02-2006, 08:48   #9 (permalink)
smallbeer
I Ain't Losing Any Sleep™
 
Join Date: Apr 2003
Posts: 5,142
sigh.
  Reply With Quote
Old 24-02-2006, 15:58   #10 (permalink)
pat
dilaudid
 
pat's Avatar
 
Join Date: Aug 2004
Location: Nelson, B.C. Canada
Posts: 9,316
Send a message via MSN to pat Send a message via Skype™ to pat
thanks largely beers. All sorted i think, http://www.2605.co.uk/
__________________
I'm a chutney farmer
  Reply With Quote
Old 24-02-2006, 19:08   #11 (permalink)
Dusty
You Ecks
 
Dusty's Avatar
 
Join Date: Sep 2004
Posts: 11,236
won't load for me?
  Reply With Quote
Reply


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

Advanced Search


Contact Us - Web Design Forums - Archive
vBulletin © 2000-2009 Jelsoft Enterprises Limited.
Search Engine Optimization by vBSEO 3.0.0 RC8