10 replies [Last post]
roelof
Offline
newbie
Last seen: 13 years 17 weeks ago
Joined: 2005-05-02
Posts: 10
Points: 0

Hello,

On my site i use div and a css file

A part of my css file looks like this :

div.content {
background-color:#FCF2E6;
border:dashed 3px #8D9719;
margin:0 227px 30px 14em;
padding:0px 20px 10px;
}

div.test {
background-color:#FCF2E6;
border:dashed 3px #8D9719;
margin:0 227px 30px 14em;
padding:0px 20px 10px;
}

When i do a :

<div class="content">

Everything looks allright.

But when i do a :

<div class="test">

Everything doesn't look good.

What must i do to make it both allright.

Roelof

DanA
DanA's picture
Offline
Elder
Last seen: 10 years 13 weeks ago
Timezone: GMT+2
Joined: 2004-08-14
Posts: 1087
Points: 2

&lt;div&gt; Css question

Do your html and css validate ?
Did you redefine .test ? as an id ?
Which browser ?
Maybe you could provide a link.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 20 weeks 22 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

&lt;div&gt; Css question

I'd love to be of assistance, but my crystal ball is in the repair shop. [/sarcasm]

http://www.catb.org/~esr/faqs/smart-questions.html

Verschwindende wrote:
  • CSS doesn't make pies

roelof
Offline
newbie
Last seen: 13 years 17 weeks ago
Joined: 2005-05-02
Posts: 10
Points: 0

&lt;div&gt; Css question

Do your html and css validate ?

Yes, they do

Did you redefine .test ? as an id ?

Can you explain what you mean with that

Which browser ? IE 6.0

Maybe you could provide a link.

Look at http://msk.knoal.nl
en then link uitslagen at Heren.

Roelof

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 20 weeks 22 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

&lt;div&gt; Css question

Um, what's the problem again?

Also, remove this:

<?xml version="1.0" encoding="windows-1252"?>

it throws IE into Quirks Mode.

THe page isn't valid HTML

http://validator.w3.org/check?verbose=1&uri=http%3A//msk.knoal.nl/index.php/%3Fs%3Dvoorpagina

(sorry, I'm picky Wink )

And why are you using a frame?

Verschwindende wrote:
  • CSS doesn't make pies

roelof
Offline
newbie
Last seen: 13 years 17 weeks ago
Joined: 2005-05-02
Posts: 10
Points: 0

&lt;div&gt; Css question

I use a frame so visitors don't see the whole url.

I will enclose the whole page and the whole css file because i use a blog.

<?xml version="1.0" encoding="windows-1252"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" href="<aanroep css file>" type="text/css" />
<title><titel van de site></title>
<!--[IF IE]>
<style type="text/css">
div.menu ul.sub li a {
width:100%;
}
</style>
<![endif]-->
</head>
<body>
<div class="header">
<h1>
MSK Basketball
</h1>
<small>De gezelligste club van het Noorden</small>
<hr />
</div>
<div class="menu">
<h2>
Navigation
</h2>
<ul>
<li>
<a href="/index.php/?s=voorpagina">Home</a>
<ul class="sub">
<li>
<a href="/index.php/?s=contributie">Contributie</a>
</li>
<li>
<a href="/index.php/?s=bestuur">Bestuur</a>
</li>
</ul>
</li>
<li>
<a href="/index.php/?s=heren">Heren 1</a>
<ul class="sub">
<li>
<a href="/index.php/?s=uitslagh">Uitslagen</a>
</li>
<li>
<a href="/index.php/?s=standh">Standen</a>
</li>
</ul>
</li>
<li>
<a href="/index.php/?s=aspiranten">Aspiranten</a>
<ul class="sub">
<li>
<a href="/index.php/?s=uitslagena">Uitslagen</a>
</li>
<li>
<a href="/index.php/?s=standena">Standen</a>
</li>
</ul>
</li>
<li>
<a href="index.php/?s=programma">Programma</a>
</li>
</ul>
<div>
If you want, you can also put one or more notes here - if you don't need it, it is
easy to remove.
</div>

<hr />
</div>
<hr />
<div class="content">
Content
</div>
<hr />
<div class="footer">
<address>
<em>Kiwicolors</em>, created by <a
href="mailto:floele[-a-t-]gmail dot com">Florian Schmitz</a> 2005
</address>
</div>
</body>
</html>

CSS file :

body {
background-color:#F8F7C4;
font:0.8em Verdana, sans-serif;
margin:0;
padding:0;
color:#1B0C0D;
}

div.content {
background-color:#FCF2E6;
border:dashed 3px #8D9719;
margin:0 227px 30px 14em;
padding:0px 20px 10px;
}

div.test {
background-color:#FCF2E6;
border:dashed 3px #8D9719;
margin:0 227px 30px 14em;
padding:0px 20px 10px;
}

div.menu {
padding-top:20px;
float:left;
color:#FCF2E6;
width:12.5em;
}

div.menu div {
margin:20px 10px 0 10px;
padding:5px;
background-color:#FCF2E6;
border:dashed 3px #8D9719;
color:#1B0C0D;
}

div.menu ul {
margin:0;
padding:0;
list-style:none;
}

div.menu ul li {
border-bottom:solid 1px #FCF2E6;
}

div.menu ul.sub {
border-bottom:solid 7px #505D00;}

div.menu ul.sub li {
text-indent:10px;
border:0;
width:100%;
}

div.menu ul li a {
display:block;
background-color:#505D00;
padding:5px 12px;
font-weight:bold;
border-left:solid 7px #505D00;
text-decoration:none;
color:#FCF2E6;
}

div.menu ul.sub li a {
border-left:solid 7px #505D00;
background-color:#85900E;
padding-left:10px;
}

div.menu ul a:hover,div.menu ul a:active {
background-color:#979F46;
border-left-color:#5D3E1B;
}
div.menu ul.sub a:hover,ul.sub a:active {
background-color:#795B4E;
border-left-color:#5D3E1B;
}

div.menu span.youarehere {
position:absolute;
left:3px;
}

div.menu h2 {
border:dashed 0.09em #DAD79B;
border-left:0;
margin:0 30px 20px 0;
padding:3px;
font-size:110%;
background-color:#505D00;
}

div.header {
padding:0 0 20px 200px;
background:url(../images/17.jpg) no-repeat #EBF08C;
margin-bottom:15px;
border-bottom:solid 2px #505D00;
}

div.header h1 {
font-size:230%;
margin:0 0 5px;
padding-top:25px;
}

div.header small {
padding-left:20px;
color:#5B3D2F;
font-size:110%;
font-weight:bold;
}

div.rightcol {
background-color:#FCF2E6;
border:dashed 3px #8D9719;
padding:0 8px 7px;
float:right;
margin:0 10px 15px;
width:180px;
}

div.footer {
clear:both;
text-align:center;
padding:3px 0;
background-color:#DAD79B;
}

div.varlinks {
position:absolute;
top:2px;right:5px;
}

address {
font-style:normal;
}

dt {font-weight:bold;}

hr {
display:none;
}

div.content hr {
display:block;
}

code {
font-size:1.2em;
padding:2px 10px;
display:block;
border: dotted 1px #1B0C0D;
}

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 20 weeks 22 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

&lt;div&gt; Css question

Um, I still can't see what the problem is.

Also, you NEED to remove the XML prolog.

Verschwindende wrote:
  • CSS doesn't make pies

DanA
DanA's picture
Offline
Elder
Last seen: 10 years 13 weeks ago
Timezone: GMT+2
Joined: 2004-08-14
Posts: 1087
Points: 2

&lt;div&gt; Css question

I did some testing with

<hr>
<div class="content">Content</div>
<hr>
<div class="test">Content</div>
<hr>

I can't see any problem with Mozilla or MSIE 6.
Maybe you should clear your browser cache (ctrl F5)

roelof
Offline
newbie
Last seen: 13 years 17 weeks ago
Joined: 2005-05-02
Posts: 10
Points: 0

&lt;div&gt; Css question

wierd,

And when you do a div="content" and another time div=""test".

I found another wierd problem which occurs about the same time.

When i look at the site on my computer, it looks like this :

This is not good. The letters are to big.

But when i look at my wife's computer , it looks like this.

And this is how the site must look like.
We both use MSIE6. Only i use a XP machine and my wife use a Win98 machine

Is very wierd. If I use Firefox everything is perfect.

Who can solve this mistery ??
Roelof

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 20 weeks 22 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

&lt;div&gt; Css question

You've probably got your font settings different to hers.

Go to view>text size> and see if they are the same.

Verschwindende wrote:
  • CSS doesn't make pies

roelof
Offline
newbie
Last seen: 13 years 17 weeks ago
Joined: 2005-05-02
Posts: 10
Points: 0

&lt;div&gt; Css question

oke, that did the trick about the letters.
Now the problem of the different div's Sad

What i want is that rightcol disappear and that div.content will be bigger.

Who can give me a tip ??

Roelof