The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Change Color in Dreamweaver, Change colors of elements in webpage
LFerr
post May 26 2019, 06:39 PM
Post #1





Group: Members
Posts: 3
Joined: 26-May 19
Member No.: 26,899



Hi,
I made a website a long time ago and it's still serving its purpose, however I wanted to give it a new color palette. There are a few elements of the page I want to change the colors of. I am unable to change the color of the navigation bar at the top along with the center section.

http://www.own-realestate.com/index.html

I was able to change the background color pretty easily to dark blue (see screenshot), but I cannot change the brown found in the content section in the center of the page.

I went so far as to screen shot the webpage and use the eyedropper tool to identify the hex code of the color I want to change (#64440D) then searched throughout the code for that hex value, but couldn't locate it.

Any help changing the colors of the two parts of the page (see screenshot) would be very much appreciated!! Thank you.

LeonAttached Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 26 2019, 09:48 PM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,277
Joined: 9-August 06
Member No.: 6



You have it here in style.css.
CODE

#wrapper {
    width: 960px;
    background-color: #640;
    margin-left:auto;
    margin-right:auto;
    color: #fff;
}


You used shorthand for the color value in the style sheet. And your picker was a little off. #664400, not #66440D.

The brown background for the header is an image - I discovered after searching your CSS for it twice. wink.gif
Maybe you took your color sample there. Images often get a little off.
User is online!PM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
LFerr
post May 27 2019, 08:47 AM
Post #3





Group: Members
Posts: 3
Joined: 26-May 19
Member No.: 26,899



Thanks a lot for this!!
Also, where can you locate the gray color represented to the right of the navigation?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 27 2019, 06:56 PM
Post #4


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,277
Joined: 9-August 06
Member No.: 6



Here.

CODE
nav ul {
    padding-left: 0;
    margin-left: 0;
    background-color: #ccc;
    color: #FFF;
    float: left;
    width: 100%;
}



Most browsers have an "inspector" nowadays. Typically you rightclick in an area of the page and choose "inspect" or similar from the context menu. The inspector opens and shows you the HTML and CSS for the page with the sections corresponding to the area you clicked focused. When you click an element in the HTML the CSS for that will be focused and the area will be highlighted on the page. You may have to click around a little to find the right spot.

It's easier and quicker than searching the style sheet, especially if you aren't already familiar with it.

Attached Image
User is online!PM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
LFerr
post May 28 2019, 07:35 AM
Post #5





Group: Members
Posts: 3
Joined: 26-May 19
Member No.: 26,899



Thanks again, I really appreciate your help! Have a great week.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 24th June 2019 - 08:19 PM