Jelle_letterpress
Aangemaakte reacties
-
Forum: Thema en CSS/opmaak
In antwoord op: Site is niet geheel responsiveHeeft iemand misschien een idee hoe ik dit kan oplossen?
Forum: Thema en CSS/opmaak
In antwoord op: Site is niet geheel responsiveBeste matt10,
Deze onderstaande CSS heb ik gevonden in de template, heb met verschillende waarden getest maar nog niet echt verder gekomen. Ben erachter dat je hiermee ook onderdelen uit kunt zetten als je overgaat van landscape naar portrait mode. Het mooiste zou zijn dat alles zichtbaar is. Zo’n dropdown menu zou super zijn :).
Bedankt voor je tijd.
Groet, Jelle/* iPad Landscape */
@media only screen and (max-width: 1024px) {
#main, #header .inside {max-width: 64.5em;}
#header { width: 21%; }
.skillList li span a{
padding: 10px 6px 10px !important;
}
}/* iPad Portrait */
@media only screen and (max-width: 768px) {
#header {
text-align: center;
float: none;
position: relative;
margin: 0px;
width: 94%;
padding: 0px 0 0px 0;
}#header #logo {
margin: 0px;
width: 100px;
}#header #logo img{
max-width: 100%;
height: auto;
}#header #sideWidgets{
margin: 0px;
}#mainNav{
right: 20px;
position:absolute; top:50%; height:20px; margin-top:-10px;
}#mainNav li{
margin: 0 0 0 1.5em;
display: inline-block;
padding: 0;
}#main {
width: 94%;
margin: 0 auto 30px auto;
padding-top: 0;
float: none;
}#homeMessage p {
font-size: 1.0em!important;
}.sidebarBox {
float: left;
margin: 0 3% 30px 0;
}#homeMessage p{
font-size: 2.7em !important;
}#projects {
margin-left: 15px;
}.flex-direction-nav {display: none !important;}
#comments { width: 100%;}
#footer {
width: 94%;
float: none;
margin: 0 0 30px 25px;
}}
/*layouts smaller than 600px, iPhone and mobiles*/
@media only screen and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px) {html {
-webkit-text-size-adjust: none;
}h1 { font-size: 1.2em;}
h2 { font-size: 1.1em;}
h3 { font-size: 1.0em;}
h4 { font-size: .9em;}
h5 { font-size: .8em;}#header {
text-align: center;
width: 99%;
padding-bottom: 15px;
margin: 0px;
position: relative;
}#header #logo {
text-align: center;
float: none;
width: 60px;
margin: 15px;
}#pageHead h1 { font-size: 1.0em;}
#pageHead {
padding: 10px 0 20px 0;
}#homeMessage{
font-size: .5em;
margin-bottom: 20px;
}#homeMessage p {
text-align: center;
}#main {
width: 94%;padding-top: 5px;
}#mainNav {
position: relative;
margin-top: 0;
top:0;
right: 0;
width: 100%;
margin: 0 0 5px 0;
display: block;
}#mainNav li{
margin: 0 0 0 0;
display: inline-block;
padding: 0 5px 0 5px;
}#content .post {
margin-bottom: 20px;
padding-bottom: 0!important;
}#projects {
margin-left: 15px;
}#footer {
width: 92%;
margin: 0 auto 0 auto;
}#footer .widgetBox {
width: 100%;
float: none;
margin-bottom: 20px;
}#footer #flickrBox .flickrImage {
margin: 0 5px 5px 0;
}#footer .secondary {
width: 100%;
padding-bottom: 10px;
text-align: center;
}#footer .secondary p{
margin: 0px;
padding: 0px;
}#footer .secondary .left,
#footer .secondary .right{
float: none;
padding-bottom: 10px;
}#commentForm input[type=”text”], #comments input[type=”text”] {
width: 40% !important;
margin-right: 5px !important;
}#commentForm label, #comments label {
font-size: .8em;
}Forum: Thema en CSS/opmaak
In antwoord op: Site is niet geheel responsiveErg bedankt voor de tip.
Ik ga hiermee aan de slag.
Uiteraard laat ik van me horen als ik vast loop of als het gelukt is natuurlijk:)Forum: Thema en CSS/opmaak
In antwoord op: Site is niet geheel responsiveBedankt voor je bericht.
Via welke weg maak ik zo’n dropdown menu?