- This topic has 7 replies, 2 voices, and was last updated 7 years, 4 months ago by Tom.
-
AuthorPosts
-
November 21, 2016 at 10:26 am #246341Diego Fernando
Hello Tom. I want to ask you two questions.
The first: When I put a page header image, on the desktop it looks excelent but on mobile, the page header does not see well. I was reading other messages when you say that it is better to do it with a code and an individual image for each size of mobile, is it still so?What is the best size for a desktop and mobile version image? I want the look of the site to look great.
The second: When I put the text in the content option of Page header and publish the post, the size I get is different depending on the device, desktop or mobile. Here is the code I am putting:
“
<span style=”font-size: 36pt;”>Esto es un ejemplo de discurso</span>
”
The relationship between the text and the image in the desktop version is good, but in mobile the text looks very large.
How can I make the letter size look good according to the device?
Thanks a lot for your help.
November 21, 2016 at 1:36 pm #246386TomLead DeveloperLead DeveloperHi there,
Yes, it’s usually a good idea to specify different images if your one background image doesn’t work on multiple screen sizes.
As for your font size, try giving your span a class instead:
<span class="my-span">Text</span>
.my-span { font-size: 36pt; } @media (max-width: 768px) { .my-span { font-size: 16pt; } }
Hope this helps 🙂
November 23, 2016 at 8:48 am #246986Diego FernandoHello Tom. I have to put this class in CSS (Simple css)?
I want that letter size in mobile looks good in page header, because when I put it in desktop looks good but in mobile looks very big.
I want that this letter size only applies for mobile page header.
The other question is: I used this code for specify different images for mobile device:
@media (max-width: 768px) {
.generate-content-header {
background: url(my-url);
}
}Is that correct? After that, I used wordpress customizer the aspect is this:example
What can I do to make the appearance of the image look good? The image size is 640×432. Thank you Tom!!
November 23, 2016 at 10:00 am #247016TomLead DeveloperLead DeveloperYes, the CSS would go in Simple CSS, and your HTML would need to be adjusted to include the class instead of the inline styles.
Try this for your image:
@media (max-width: 768px) { .generate-content-header { background: url(my-url); background-size: cover; background-position: center center; } }
November 23, 2016 at 10:16 am #247024Diego FernandoAnd tom, If I want to put different images for each post? ¿Can code change?
November 23, 2016 at 10:18 am #247025TomLead DeveloperLead DeveloperUse my Simple CSS plugin – it has a meta box for CSS on specific pages: https://wordpress.org/plugins/simple-css/
November 23, 2016 at 10:46 am #247035Diego FernandoI did it Tom. Thanks a lot 🙂 !
November 23, 2016 at 1:57 pm #247088TomLead DeveloperLead DeveloperYou’re welcome 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.