CSS stylesheet aanpassen

Status
Niet open voor verdere reacties.

joanne

Terugkerende gebruiker
Lid geworden
31 mrt 2001
Berichten
1.300
Hallo mensen,

Heb hier een deel van een CSS stylesheet geplaatst met 4 kolommen. Werkt allemaal prima, ook in alle browsers. Maar nu wil ik voor een andere pagina een 3 koloms sheet hebben, dus min of meer kolommen 2 en 3 mergen naar kolom 2, gewoon kolom 2 verwijderen en nummers aanpassen.
Nog zaken waar ik specifiek op moet letten?

Vast bedankt.
:)



PHP:
#col_one { 
display : inline;
width : 198px;
float : left;
min-height : 440px;
background-color : #fff;
border-top : 1px solid #ccc;
border-left : 1px solid #ccc;
border-bottom : 1px solid #ccc;
} 
* html #col_one { 
height : 440px;
} 
#col_one h2 { 
background-color : #000;
color : #f1f1f1;
font-family : verdana;
font-size : 16px;
padding-left : 5px;
padding-top : 3px;
padding-bottom : 4px;
margin-right : 1px;
} 
#col_one h3 { 
font-family : verdana;
font-size : 0.9em;
padding-top : 10px;
padding-left : 15px;
padding-bottom : 5px;
color : #a06314;
background-image : url(images/news.gif);
background-repeat : no-repeat;
background-position : left 10px;
margin-left : 10px;
}

/* hier uitzoeken met de paddings */
#col_one p { 
font-family : verdana;
/* font-size : 0.75em; dit dus aangepast, anders niet te lezen */
font-size : 0.90em;
padding-left : 15px; 
padding-bottom : 5px;
margin-left : 10px;
margin-right : 10px;
/* text-align : justify; niks justify, uitlijnen niet mooi */
padding-right : 20px;
background-color : #eff6ff;
} 


/* erbij gezet */

#col_one h6 { 
font-family : verdana;
/* font-size : 0.75em; dit dus aangepast, anders niet te lezen */
font-size : 1.14em;
}








#col_one a { 
margin-left : 25px;
margin-bottom : 2px;
color : #48b033;
font-size : 0.8em;
font-weight : bold;
padding : 2px;
} 
#col_two { 
display : inline;
width : 200px;
float : left;
min-height : 440px;
background-color : #fff;
border-top : 1px solid #ccc;
border-bottom : 1px solid #ccc;
} 
* html #col_two { 
height : 440px;
} 
#col_two p { 
font-size : 0.9em;
/* text-align : justify; */
background-color : #e6e6e6;
margin-left : 5px;
margin-right : 5px;
margin-top : 5px;
padding : 3px;
} 
#col_two h2 { 
background-color : #299ad4;
color : #f1f1f1;
font-family : verdana;
font-size : 16px;
padding-top : 3px;
padding-left : 5px;
padding-bottom : 4px;
} 
#col_two img { 
margin-top : 5px;
margin-left : 5px;
} 
#col_two h3 { 
/* text-align : center; */
font-family : verdana;
font-size : 12px;
padding-top : 10px;
padding-bottom : 5px;
font-weight : lighter;
} 
#col_two ul { 
margin-left : 15px;
margin-top : 5px;
color : #667dff;
} 
#col_two li { 
padding-top : 5px;
padding-left : 10px;
list-style-type : square;
list-style-position : inside;
} 
#col_two a { 
color : #667dfe;
font-weight : bold;
text-decoration : underline;
font-size : 0.8em;
} 
#col_three { 
border-left : 1px solid #fffff0;
border-right : 1px solid #fffff0;
display : inline;
width : 198px;
float : left;
min-height : 440px;
background-color : #fff;
border-top : 1px solid #ccc;
border-bottom : 1px solid #ccc;
} 
* html #col_three { 
height : 440px;
} 
#col_three p { 
font-size : 0.9em;
/* text-align : justify; */
background-color : #e6e6e6;
margin-left : 5px;
margin-right : 5px;
margin-top : 5px;
padding : 3px;
} 
#col_three h2 { 
background-color : #6c9626;
color : #f1f1f1;
font-family : verdana;
font-size : 16px;
padding-left : 5px;
padding-top : 3px;
padding-bottom : 4px;
} 
#col_three img { 
margin-top : 5px;
margin-left : 5px;
} 
#col_three h3 { 
text-align : center;
font-family : verdana;
font-size : 14px;
padding-top : 10px;
padding-bottom : 5px;
font-weight : lighter;
} 
#col_three a { 
color : #667dfe;
font-weight : bold;
text-decoration : underline;
font-size : 0.8em;
} 
#col_four { 
/* wat te doen? H6 fontsize vergroten bij column 1 */


display : inline;
width : 200px;
float : left;
min-height : 440px;
background-color : #fff;
border-top : 1px solid #ccc;
border-right : 1px solid #ccc;
border-bottom : 1px solid #ccc;
} 
* html #col_four { 
height : 440px;
} 
#col_four p { 
font-family : verdana;
font-size : 0.75em;
padding-bottom : 5px;
margin-top : 5px;
margin-left : 10px;
margin-right : 10px;
/* text-align : justify; */
background-color : #eff6ff;
} 
#col_four h2 { 
background-color : #e48f00;
color : #f1f1f1;
font-family : verdana;
font-size : 16px;
padding-left : 5px;
padding-top : 3px;
padding-bottom : 4px;
} 
#col_four a { 
color : #48b033;
} 
#footer { 
margin-top : 3px;
border : 1px solid #ccc;
background-color : #299ad4;
display : inline;
float : left;
width : 800px;
padding-top : 5px;
padding-bottom : 5px;
text-align : center;
} 
#footer p { 
padding-top : 5px;
padding-bottom : 5px;
font-size : 0.8em;
}
 
Laatst bewerkt:
Ben er eruit, inderdaad de 3e kolom verwijderen, aantal pixels bij 2 vermeerderen.
that's it.

:rolleyes:
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan