Søg i Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

How do I change the layout of Google search?

more options

Today I deleted some cookies from Firefox. I'm not sure why this was relevant, but immediately after, the layout of my Google searches changed.

Picture 1 - How it looked before the change (demonstrated using IE)

Picture 2 - How it looks now (notice the boxes and that less results fit on the page)

Can anyone help me revert to the old version?

Today I deleted some cookies from Firefox. I'm not sure why this was relevant, but immediately after, the layout of my Google searches changed. Picture 1 - How it looked before the change (demonstrated using IE) Picture 2 - How it looks now (notice the boxes and that less results fit on the page) Can anyone help me revert to the old version?

Alle svar (7)

more options
more options

Good evening,

do you think the search results from Google? There remains the problem? Thank you for understand.

Best regards, David-Walczysko Volunteer supporter

more options

It is Google doing this by applying margin-top and margin-bottom settings via an inline style sheet.

.g {
	margin-top:0;
	margin-bottom:23px;
}

I'm using code in userContent.css to change the page view.

Add code to the userContent.css file.


@-moz-document domain(google.com) {
 #search div.g, #search div.rgsep {
  border-bottom-color:#222;
  border-bottom-style:dotted;
  border-bottom-width:1px;
  margin-bottom:5px!important;
  padding-bottom:5px!important
 }
}

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

You can use this button to go to the current Firefox profile folder:

  • create the chrome folder (lowercase) in the <xxxxxxxx>.default profile folder if this folder doesn't exist
  • use a plain text editor like Notepad to create a (new) userContent.css file in the chrome folder (file name is case sensitive)
  • paste the code in the userContent.css file in the editor window
  • make sure that you select "All files" and not "Text files" when you save the file via "Save file as" in the text editor as userContent.css.
    otherwise Windows may add a hidden .txt file extension and you end up with a not working userContent.css.txt file
more options

cor-el said

It is Google doing this by applying margin-top and margin-bottom settings via an inline style sheet.
.g {
	margin-top:0;
	margin-bottom:23px;
}

I'm using code in userContent.css to change the page view.

Add code to the userContent.css file.


@-moz-document domain(google.com) {
 #search div.g, #search div.rgsep {
  border-bottom-color:#222;
  border-bottom-style:dotted;
  border-bottom-width:1px;
  margin-bottom:5px!important;
  padding-bottom:5px!important
 }
}

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

You can use this button to go to the current Firefox profile folder:

  • create the chrome folder (lowercase) in the <xxxxxxxx>.default profile folder if this folder doesn't exist
  • use a plain text editor like Notepad to create a (new) userContent.css file in the chrome folder (file name is case sensitive)
  • paste the code in the userContent.css file in the editor window
  • make sure that you select "All files" and not "Text files" when you save the file via "Save file as" in the text editor as userContent.css.
    otherwise Windows may add a hidden .txt file extension and you end up with a not working userContent.css.txt file



Hi Co-rel, thank you for your help, but I didn't have much luck with your suggestion. It seems reasonable, so can I just give you the process I followed to confirm I have understood and used the correct code?

1) Navigated to my profile folder.

2) Created a folder called "chrome"

3) In that folder, created a notepad called user.Content.css

4) Copied the following code:

@-moz-document domain(google.com) {

#search div.g, #search div.rgsep {
 border-bottom-color:#222;
 border-bottom-style:dotted;
 border-bottom-width:1px;
 margin-bottom:5px;
 padding-bottom:5px
}

}

5) Saved as "All Files"

more options

The code works for me, but will only work for the Google.com domain. If you are redirected to another Google domain then you can modify the domain or add extra Google domains.


@-moz-document domain(google.com), domain(google.co.uk) {
 #search div.g, #search div.rgsep {
  border-bottom-color:#222;
  border-bottom-style:dotted;
  border-bottom-width:1px;
  margin-bottom:5px!important;
  padding-bottom:5px!important
 }
}
more options

The file name is incorrect.

"3) In that folder, created a notepad called user.Content.css"

userContent.css without the period between the r and the C'.

more options

cor-el said

The code works for me, but will only work for the Google.com domain. If you are redirected to another Google domain then you can modify the domain or add extra Google domains.
@-moz-document domain(google.com), domain(google.co.uk) {
 #search div.g, #search div.rgsep {
  border-bottom-color:#222;
  border-bottom-style:dotted;
  border-bottom-width:1px;
  margin-bottom:5px!important;
  padding-bottom:5px!important
 }
}

Another reasonable suggestion, as I've been using Google.CO.UK, so I copied the code exactly as you presented it Cor-el, but still no luck.

Can also confirm that the file is correctly named userContent.css, as Edmeister suggests.