Toon posts:

[ie] Layout verschilt in ie met firefox

Pagina: 1
Acties:
  • 340 views sinds 30-01-2008
  • Reageer

maandag 25 april 2005 19:43

Acties:
  • Quadro!
  • Registratie: Maart 2004
  • Laatst online: 03-05 15:43

Quadro!

Topicstarter
Ik ben bezig met de volgende site: http://www.johnnyb.uwhost2.net/newAim/
Wanneer je hem in vuurvoske opent is er niks aan de hand, maar als je hem in internet explorer
opent, dan zitten er tussen "posted by:" en het artikel een stuk zwart wat er niet hoort
en ik kom er maar niet achter hoe ik het in ie weg kan halen. Ik weet al wel dat het zwart de
achtergrond van de "mainContent-div" is.

En nog een klein vraagje: hoe kan ik de div "userLogin" op zelfde hoogte als "mainContent" krijgen?
Ik kan de oplossing daar maar niet van vinden 8)7

Hier de relevante (x)html code:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

<body>

<div id="mainContainer">

<div id="top"></div>

<div id="menu">
        <div id="menuLeft"></div>
        <div id="menuContent"></div>

        <div id="menuRight"></div>
</div>

<div id="header"></div>

<div id="content">
        <div id="mainContent">

            <div class="mainContentRow1">Wow</div>
            <div class="mainContentRow2">Posted By: Wow</div>
            <div class="mainContentRow3Top"></div>

            <div class="mainContentRow3Con">14 April 00:18  -  Eric R. Rudolph pleaded guilty in two federal courts to four bombings that killed two people and injured more than 100 others.</div>

            <div class="mainContentRow1">Wow</div>
            <div class="mainContentRow2">Posted By: Wow</div>
            <div class="mainContentRow3Top"></div>
            <div class="mainContentRow3Con">14 April 00:18  -  Eric R. Rudolph pleaded guilty in two federal courts to four bombings that killed two people and injured more than 100 others.</div>

            <div class="mainContentBottomMargin" style="height: 50px;"></div>

            <div class="mainContentBottom"><a href="/newAim/index.php" class="redBold">Home</a></div>

        </div>
    <div id="login">sdfdsf
    </div>
</div>
<div id="footer"></div>
</div>

</body>


en hier de relevante css code:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136

#mainContainer
{
    position:           absolute;
    top:                0px;
    bottom:             0px;
    margin-bottom:      0px;
    left:               50%;
}

#content
{
    position:           relative;
    left:               -475px;
    padding-left:       80px;

    width:              951px;
    min-height:         310px;

    background-image:   url(graphics/base/sideBoth.jpg);
    background-repeat:  repeat-y;
}


#mainContent
{
    margin:                 0px;
    position:               relative;

    width:                  361px;
    padding-top:            25px;

    background-image:       url(graphics/content/standard/mainContent/mainContent.jpg);
    background-position:    0px 0px;
    background-repeat:      no-repeat;

    color:                  #000000;
}

.mainContentRow1
{
    position:               relative;
    top:                    0px;

    width:                  361px;
    height:                 20px;

    padding-left:           12px;
    background-image:       url(graphics/content/standard/mainContent/mainContentRow1.jpg);
    background-repeat:      no-repeat;

    font-family:            arial,sans-serif,helvetica;
    font-size:              8.5pt;
    font-weight:            bold;
}

.mainContentRow2
{
    position:               relative;
    top:                    0px;

    width:                  361px;
    height:                 16px;

    padding-left:           12px;

    background-image:       url(graphics/content/standard/mainContent/mainContentRow2.jpg);
    background-repeat:      no-repeat;

    font-family:            arial,sans-serif,helvetica;
    font-size:              8.5pt;
}

.mainContentRow3Top
{
    position:               relative;
    top:                    0px;

    width:                  361px;
    height:                 2px;

    background-image:       url(graphics/content/standard/mainContent/mainContentRow3Top.jpg);
    background-repeat:      no-repeat;
}

.mainContentRow3Con
{
    position:               relative;
    top:                    0px;

    width:                  361px;

    padding-left:           24px;
    padding-right:          24px;

    background-image:       url(graphics/content/standard/mainContent/mainContentRow3Con.jpg);
    background-repeat:      repeat-y;

    font-family:            arial,sans-serif,helvetica;
    font-size:              8.5pt;
}

.mainContentBottom
{
    position:               relative;
    top:                    0px;
    width:                  361px;
    height:                 50px;

    padding-left:           152px;

    background-image:       url(graphics/content/standard/mainContent/mainContentBottom.jpg);
    background-repeat:      no-repeat;
}
        
.mainContentBottomMargin
{
    position:               relative;
    top:                    0px;
    width:                  361px;

    background-image:       url(graphics/content/standard/mainContent/mainContentBottomMargin.jpg);
    background-repeat:      repeat-y;
}

#login
{
    position:               relative;
    left:                   361px;

    width:                  215px;
    padding-top:            25px;

    background-image:       url(graphics/content/standard/userLogin.jpg);
    background-position:    0px 0px;
    background-repeat:      no-repeat;
}

maandag 25 april 2005 19:48

Acties:

Verwijderd

woei gebruik je wel eens iets anders als div?

maar om je vraag te beantwoorden: IE geeft een div altijd een minimumhoogte, namelijk de regelhoogte, dus die .mainContentRow3Top wordt wat hoger. Oplossen door font-size en linheight line-height op 0 te zetten

@André: alle eer aan jou hoor, ik zei het in eerste instantie nog fout ook :>

[ Voor 26% gewijzigd door Verwijderd op 25-04-2005 19:52 ]

maandag 25 april 2005 19:48

Acties:
  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

Misschien moet je de line-height van .mainContentRow3Top op 2px zetten.

/edit:
mophor: kon je niet even wachten :/ ;)

[ Voor 28% gewijzigd door André op 25-04-2005 19:50 ]

maandag 25 april 2005 19:53

Acties:
  • Quadro!
  • Registratie: Maart 2004
  • Laatst online: 03-05 15:43

Quadro!

Topicstarter
duizend maal dank :)
en @ de userLogin div?

maandag 25 april 2005 19:58

Acties:

Verwijderd

owja,

float: left;

maandag 25 april 2005 20:06

Acties:
  • T-MOB
  • Registratie: Maart 2001
  • Nu online

T-MOB

Ik zet altijd de overflow op 'hidden' om dit op te lossen. Maar goed, ff iets anders, als je helvetica als alternatief font wil opgeven kun je hem beter vóór sans-serif plaatsen. Nu staat het er namelijk nogal nutteloos aangezien elk systeem sans-serif kent. Helvetica zal dus nooit worden gebruikt..

Regeren is vooruitschuiven

Pagina: 1
Reageer