Is there a way to resize a photo that I want to upload?

Have you visited this website?

---SPANISH LANGUAGE

Here is another site to check out:

ENGLISH LANGUAGE

I'm having trouble with the image on the Spanish site showing up correctly. I want it to look like the image on the English site's front page.

Even after resizing the image, it's still not looking good on the Spanish site. Here's the CSS code I've been using:

   .page-id-553 #content
{

background:url("/wp-content/themes/reliance/images/ccc.jpg")
}

Could the image size be the problem? I've tried reducing it, but it's not improving the look. Can you help me figure this out?

Thank you in advance!

htmlcss

Answer №1

After reviewing your website, I noticed a CSS change that needs to be addressed.

On the page , you have implemented the following code:

background-image: url(http://reliance.dg-site.com/wp-content/uploads/2014/05/shutterstock_132802436-13.jpg);

for the body tag.

However, on the page 

.page-id-553 #content
{
  background:url("/wp-content/themes/reliance/images/ccc.jpg")
}

Please remove the code within .page-id-553 #content{ } and replace it with:

body {
  background-image: url("/wp-content/themes/reliance/images/ccc.jpg");
}

If you wish to have a background for this specific page, you can try:

body.page-id-553 {
  background-image: url("/wp-content/themes/reliance/images/ccc.jpg");
}

Answer №2

Greetings on your visit to SO. In future inquiries, it would greatly benefit us if you could provide more specific details about your needs. Additionally, sharing the methods you have already tried could assist in pinpointing the issue.

Based on the information provided, implementing the following CSS code within the .page-id-553 #content class/id in the console should achieve the desired outcome:

background-size: cover;
background-repeat: no-repeat;
background-position: center center;

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Browse through and review all information - utilizing python selenium

I am currently working on a project that involves scrolling and retrieving every post made by users. However, I am facing an issue where my code is only reading 2 or 3 posts before moving on to the next one. I have tried adjusting the sleep() duration, p ...

pythoncssseleniumdomscroll

What's the best way to ensure consistent spacing between a label and input field, regardless of the length of the text?

Imagine a scenario where there are 10 input fields, each preceded by a span tag on the left side indicating what should be entered. While working on this setup, I encountered an issue - how can I create a consistent space between the span tag and the input ...

formscsshtml

Utilizing Bootstrap for Centering Content Vertically and Horizontally

My login form is designed with a simple layout using Bootstrap 3.3.7 and a wrapper class div. However, when viewed on a full browser screen, the text boxes overlap the labels. How can I adjust it so that the default bootstrap behavior is applied to the for ...

htmlcsstwitter-bootstrap

What is the best way to increase the size of the input field to allow for more typing space?

My query is quite simple. Even when I set the height to 100px, the cursor still starts in the middle of the input box. I want the entire box to be utilized with the cursor starting at the top left corner for a more intuitive paragraph writing experience. ...

htmlcss

How to Left Align Div Centered Within Another Div?

I've encountered an issue with centering icons in my HTML code. Despite trying to fix it myself, the icons always appear left-aligned. I would greatly appreciate any assistance from the helpful members of this community. It's likely a simple fix ...

csshtmlcss-float

Tips for displaying multiple rows horizontallyALLOWING multiple rows to appear horizontally can be achieved by

This is a demonstration of my desired outcome https://i.sstatic.net/UErvL.png However, I am currently only able to show one product per row. I have attempted the following approach, but it is not functioning as expected. <ol> <?php $no = 1; ...

phphtmlcssphp-7

Top-notch loading icon using jquery

Recently, I embarked on the journey of learning Javascript and jQuery simultaneously, and to my surprise, it feels quite manageable. As I delve deeper into creating functions, I am currently working on displaying a loading image. While I initially used on ...

jquerycsshtml

Ensuring complete height and width with no scrollbar in a Material UI React application

I'm attempting to create a page that fills the entire height of the screen without adding an undesirable scrollbar. When I say 100% height, I mean it should just fit the size of the screen. Here is a demonstration of the issue. The yellow highlighted ...

htmlcssreactjsmaterial-ui

Centering an image and menu in the middle of an HTML page

I have a school project where I am trying to align both an image and a menu in the center and middle. Here is my code on CodePen: LINK I will also share the code here: HTML <header> <img id="logo" src="https://exampleimage.com/logo.jpg"> < ...

htmlcss

"Efficiently setting up individual select functions for each option in a UI select menu

I've integrated UI Selectmenu into my current project UI selectmenu includes a select option that allows for setting select behavior across all selectmenu options, as shown in the code snippet below: $('.anything'). selectmenu({ ...

javascriptjqueryhtmljquery-uiselect-menu

What is the best way to link an HTML button to a Python (or Flask) function?

When it comes to flask programming, the common practice is to use 'url_for' like {{url_for = 'some url'}}. This method involves linking URLs with the corresponding route in the application, as well as mapping templates (HTML). However, ...

pythonhtmlflask

.css files standing their ground against modifications

Currently, I'm utilizing the WebStorm IDE to work on my React project. My goal is to make modifications to the app.css files in order to update the design. However, each time I attempt to build or run the project, it dismisses all of the changes I&apo ...

cssreactjsgulp

What is the best way to indicate progress as the canvas resizes an image?

Is there a way for me to access progress updates? My main focus is on receiving progress information, regardless of how it will be displayed. I may choose to use a progress bar in the future, but my current inquiry pertains solely to obtaining the data it ...

javascripthtmlcanvas

Unleash the power of CSS3 to style this button

I received an image of a button that I need to replicate on a website, but unfortunately, only the image was provided without any information about the font-family or size. Despite not being a designer or CSS expert, I attempted to create a CSS style that ...

css

Disable the parent CSS styling when focusing on the child button

Within an anchor tag, I have a div element. The CSS on the :active state is set to transform the element, but I want to avoid this behavior when focusing on the child element bx--overflow-menu. I am working with NextJS using styled-jsx and SaSS. Here is my ...

cssreactjssassnext.jsstyled-components

Controlling the order of class specification prioritization

I have a situation with DOM elements that possess both the foo and bar classes: <div class="foo bar">...</div> I am looking to manage the priority between them. Referring to the W3C specification on this matter, I considered that appending ad ...

css

Looking to authenticate a CSS span class within an XML document using Oxygen Program?

This is in connection with my initial query. The XML does not recognize the CSS span class. <l rend="indent"> <span class="face_dropcap_ ">C</span><hi rend="initial_roman">E</hi>stoit alors que le prefent des <span class= ...

cssxmloxygenxml

Is there a way for me to insert a variable into the src attribute of my img tag like this: `<img alt="Avatar" src=`https://graph.facebook.com/${snAvatarSnuid}/picture`>`

I need assistance with passing a variable called snAvatarSnuid within the img src tag, specifically after facebook.com/ and before /picture as shown below: <img alt="Avatar" src=`https://graph.facebook.com/${snAvatarSnuid}/picture`> Note: 1) The ht ...

javascripthtmlvue.jsvuejs2web-frontend

Navigating to different HTML pages by utilizing <a> elements in Angular 2

As a newcomer to Angular 2, I've decided to build my personal website using this framework. The main page of my website contains bio information, while the other page will feature blog content. Both pages will have a shared header and footer, but diff ...

htmlangulartypescriptangular2-routingangular2-template

Struggling to retrieve the dynamic select list information from HTML and pass it to PHP. Any suggestions or guidance would be greatly

<form method="POST" name="mailform" action="sendmail.php"> <fieldset> <?php require_once("mysql_connect.php"); $sql = mysql_query( " SELECT NAME FROM TABLE WHERE ID = ( SELECT ID FROM TABLE2 WHERE COLUMN = '$USERNAME') ORD ...

phphtmlmysql