As far as I understand you need to hide those big icons visible to the left & right of articles one the home page (smartphone version).
Add to your css for smartphones:
article.home-item-full {background-image: none;}
& tell me if it works.
Thread Starter
Silvio
(@nem3sis)
hi
that is exactly what i need. thanks.
but i only have one css. if i add that now to it, all the images will go away for all devices, right?
silvio
Thread Starter
Silvio
(@nem3sis)
hi again.
i did add the line in the section of my css labeled Mobile layout. no affect at all.
any ideas why?
you might need to add !important to the styles to enforce them, as the background image is inserted by an inline style.
the best might be if you contact the developer of your theme for support with your question;
http://codex.wordpress.org/Forum_Welcome#Commercial_Products
Thread Starter
Silvio
(@nem3sis)
thank you. i already contacted the guys who made the theme. i have something else i need to be done. so lets hope they know how to help me. if not them, you then.
thank you for your help anyway. i will set this thread to resolved now.
silvio
in your theme css file
http://sprecherplanet.de/wp-content/themes/only/style.css?ver=1.1.0
around line 2077 there is something like this:
/* #######################################################################
7. Mobile layout
####################################################################### */
right after the above code add this:
article.home-item-full {background-image: none;}
and tell me if it works.
Thread Starter
Silvio
(@nem3sis)
hi chris.
thank you for your time. much appreciated.
i added this here now:
<<<<<<<<<<<<<<<<<<<<
@media screen and (max-width: 24em) { /* 768px */
.home-item { background-image: none !important; }
<<<<<<<<<<<<<<<<<<<
i gad to adjust it a little bit (it was 48em before, but that gave me very large pics then for some reason). now it works on mobile, tablet and desktop the way i want it too.
i only have one small other problem. i need the text in the mobile version to be moved a little bit more inside. like a view pixels left and right between text and border. right now it is attached to the edge of the screen. that is really annoying.
any idea what to do about that?
silvio
Let me assume: you need a little margin between body text and background edge.
div.inner p {margin: 0 10px;}
also if you want your logo to be resized responsively:
img.the-logo {width: 100%;}
