X
Tap here to go to the mobile version of the site.

Support Forum

Firefox Home page won't resize content to fit the shape of the window.

Posted

The Firefox Home page does not properly resize content to fit the window size. I have had this issue for a while on my laptop, but it just started to happen on my desktop also with the 70.0 update. I posted about it on reddit a while back to try and find help, but no one was able to give me any. Here are some screenshots of the issue on mac from that original post https://imgur.com/a/vTlXfmJ I just want to know if there is any solution to this issue or if anyone else is reporting it. I haven't been able to find any other posts about it and got basically no response from the reddit.

The Firefox Home page does not properly resize content to fit the window size. I have had this issue for a while on my laptop, but it just started to happen on my desktop also with the 70.0 update. I posted about it on reddit a while back to try and find help, but no one was able to give me any. Here are some screenshots of the issue on mac from that original post https://imgur.com/a/vTlXfmJ I just want to know if there is any solution to this issue or if anyone else is reporting it. I haven't been able to find any other posts about it and got basically no response from the reddit.
Attached screenshots

Chosen solution

Hi Austin, the layout of the page changed. It previously had a design that could wrap Top Sites tiles to a new row based on the page width, and it now has a fixed width layout.

You could override this using custom style rules in a userContent.css file, but I haven't developed a complete recipe. To get the general idea, here are the variable width rules for the "main" tag adapted to the Top Sites section:

@media (min-width: 610px) {
	.discovery-stream.ds-layout {
		width: 530px !important; 
	} 
}
@media (min-width: 866px) {
	.discovery-stream.ds-layout {
		width: 786px !important; 
	} 
}
@media (min-width: 1122px) {
	.discovery-stream.ds-layout {
		width: 1042px !important; 
	} 
}

To see the effect, while on the new tab page, press Shift+F7 to open the Style Editor tool. Click the + button to add a new style sheet, then paste in those rules. As you reduce the width of the window, the number of tiles in each row of the Top Sites grid should be reduced to fit.

It's not pretty. Someone will need to work on finding the right widths to break at, and also how to deal with the search box.

Read this answer in context 1
Quote

Additional System Details

Installed Plug-ins

  • Shockwave Flash 32.0 r0

Application

  • Firefox 70.0
  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:70.0) Gecko/20100101 Firefox/70.0
  • Support URL: https://support.mozilla.org/1/firefox/70.0/WINNT/en-US/

Extensions

  • Amazon SMILE! 1.4.5 ({1417a6e0-be73-4358-912c-5dce719b5791})
  • Amazon.com 1.1 (amazondotcom@search.mozilla.org)
  • Ask Historians Comment Helper 1.0.2 (ask_historians_comment_helper@reddit)
  • Bing 1.0 (bing@search.mozilla.org)
  • DuckDuckGo 1.0 (ddg@search.mozilla.org)
  • DuckDuckGo Privacy Essentials 2019.9.12 (jid1-ZAdIEUB7XOzOJw@jetpack)
  • eBay 1.0 (ebay@search.mozilla.org)
  • Enhanced Steam 10.0 (jid1-YdiFiTEkQgInxA@jetpack)
  • FrankerFaceZ 4.0 (frankerfacez@frankerfacez.com)
  • Google 1.0 (google@search.mozilla.org)
  • LastPass: Free Password Manager 4.35.1.2 (support@lastpass.com)
  • NordVPN Proxy Extension - Privacy & Security 2.14.1 (nordvpnproxy@nordvpn.com)
  • Reddit Enhancement Suite 5.18.4 (jid1-xUfzOsOFlzSOXg@jetpack)
  • Reddit-Sidebar-Hider 1.4 ({6d0dcf9c-c29f-4ec3-836d-0ad795dfd2b8})
  • Stylus 1.5.6 ({7a7a4a92-a2a0-41d1-9fd7-1e92480d612d})
  • The FFZ Add-On Pack 3.2.1 (@ffz-ap)
  • Twitter 1.0 (twitter@search.mozilla.org)
  • uBlock Origin 1.23.0 (uBlock0@raymondhill.net)
  • Wikipedia (en) 1.0 (wikipedia@search.mozilla.org)
  • Ace Script 1.1.13 (acewebextension_unlisted@acestream.org) (Inactive)
  • BetterTTV 7.2.70 (firefox@betterttv.net) (Inactive)

Javascript

  • incrementalGCEnabled: True

Graphics

  • adapterDescription: Radeon RX 580 Series
  • adapterDescription2:
  • adapterDeviceID: 0x67df
  • adapterDeviceID2:
  • adapterDrivers: aticfx64 aticfx64 aticfx64 amdxc64 aticfx32 aticfx32 aticfx32 amdxc32 atiumd64 atidxx64 atidxx64 atiumdag atidxx32 atidxx32 atiumdva atiumd6a
  • adapterDrivers2:
  • adapterRAM: 8192
  • adapterRAM2:
  • adapterSubsysID: 34181462
  • adapterSubsysID2:
  • adapterVendorID: 0x1002
  • adapterVendorID2:
  • clearTypeParameters: \\.\DISPLAY1 [ Gamma: 1.8 Pixel Structure: RGB ClearType Level: 100 Enhanced Contrast: 50 ] \\.\DISPLAY2 [ Gamma: 1.8 Pixel Structure: RGB ClearType Level: 100 Enhanced Contrast: 50 ]
  • contentUsesTiling: True
  • crashGuards: []
  • direct2DEnabled: True
  • directWriteEnabled: True
  • directWriteVersion: 10.0.18362.356
  • driverDate: 8-23-2019
  • driverDate2:
  • driverVendor:
  • driverVendor2:
  • driverVersion: 26.20.13001.40003
  • driverVersion2:
  • featureLog: {u'fallbacks': [], u'features': [{u'status': u'available', u'description': u'Compositing', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'HW_COMPOSITING'}, {u'status': u'available', u'description': u'Direct3D11 Compositing', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'D3D11_COMPOSITING'}, {u'status': u'available', u'description': u'Direct2D', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'DIRECT2D'}, {u'status': u'available', u'description': u'Direct3D11 hardware ANGLE', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'D3D11_HW_ANGLE'}, {u'status': u'available', u'description': u'GPU Process', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'GPU_PROCESS'}, {u'status': u'available', u'description': u'WebRender', u'log': [{u'status': u'opt-in', u'message': u'WebRender is an opt-in feature', u'type': u'default'}, {u'status': u'available', u'message': u'Qualified in release', u'type': u'user'}], u'name': u'WEBRENDER'}, {u'status': u'available', u'description': u'WebRender qualified', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'WEBRENDER_QUALIFIED'}, {u'status': u'available', u'description': u'Off Main Thread Painting', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'OMTP'}, {u'status': u'available', u'description': u'Advanced Layers', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'ADVANCED_LAYERS'}]}
  • info: {u'AzureContentBackend (UI Process)': u'skia', u'CMSOutputProfile': u'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', u'AzureCanvasBackend (UI Process)': u'skia', u'ApzWheelInput': 1, u'ApzDragInput': 1, u'ApzKeyboardInput': 1, u'AzureFallbackCanvasBackend (UI Process)': u'none', u'ApzAutoscrollInput': 1, u'AzureCanvasBackend': u'direct2d 1.1', u'AzureContentBackend': u'skia'}
  • isGPU2Active: False
  • numAcceleratedWindows: 1
  • numTotalWindows: 1
  • offMainThreadPaintEnabled: True
  • offMainThreadPaintWorkerCount: 4
  • targetFrameRate: 60
  • usesTiling: False
  • webgl1DriverExtensions: GL_ANGLE_client_arrays GL_ANGLE_depth_texture GL_ANGLE_explicit_context GL_ANGLE_explicit_context_gles1 GL_ANGLE_framebuffer_blit GL_ANGLE_framebuffer_multisample GL_ANGLE_instanced_arrays GL_ANGLE_lossy_etc_decode GL_ANGLE_memory_size GL_ANGLE_multi_draw GL_ANGLE_multiview_multisample GL_ANGLE_pack_reverse_row_order GL_ANGLE_program_cache_control GL_ANGLE_provoking_vertex GL_ANGLE_request_extension GL_ANGLE_robust_client_memory GL_ANGLE_texture_compression_dxt3 GL_ANGLE_texture_compression_dxt5 GL_ANGLE_texture_usage GL_ANGLE_translated_shader_source GL_CHROMIUM_bind_generates_resource GL_CHROMIUM_bind_uniform_location GL_CHROMIUM_color_buffer_float_rgb GL_CHROMIUM_color_buffer_float_rgba GL_CHROMIUM_copy_compressed_texture GL_CHROMIUM_copy_texture GL_CHROMIUM_sync_query GL_EXT_blend_func_extended GL_EXT_blend_minmax GL_EXT_color_buffer_half_float GL_EXT_debug_marker GL_EXT_discard_framebuffer GL_EXT_disjoint_timer_query GL_EXT_draw_buffers GL_EXT_float_blend GL_EXT_frag_depth GL_EXT_instanced_arrays GL_EXT_map_buffer_range GL_EXT_occlusion_query_boolean GL_EXT_read_format_bgra GL_EXT_robustness GL_EXT_sRGB GL_EXT_shader_texture_lod GL_EXT_texture_compression_bptc GL_EXT_texture_compression_dxt1 GL_EXT_texture_compression_s3tc_srgb GL_EXT_texture_filter_anisotropic GL_EXT_texture_format_BGRA8888 GL_EXT_texture_rg GL_EXT_texture_storage GL_EXT_unpack_subimage GL_KHR_debug GL_KHR_parallel_shader_compile GL_KHR_robust_buffer_access_behavior GL_NV_EGL_stream_consumer_external GL_NV_fence GL_NV_pack_subimage GL_NV_pixel_buffer_object GL_OES_EGL_image GL_OES_EGL_image_external GL_OES_compressed_ETC1_RGB8_texture GL_OES_depth32 GL_OES_element_index_uint GL_OES_get_program_binary GL_OES_mapbuffer GL_OES_packed_depth_stencil GL_OES_rgb8_rgba8 GL_OES_standard_derivatives GL_OES_surfaceless_context GL_OES_texture_border_clamp GL_OES_texture_float GL_OES_texture_float_linear GL_OES_texture_half_float GL_OES_texture_half_float_linear GL_OES_texture_npot GL_OES_vertex_array_object OES_compressed_EAC_R11_signed_texture OES_compressed_EAC_R11_unsigned_texture OES_compressed_EAC_RG11_signed_texture OES_compressed_EAC_RG11_unsigned_texture OES_compressed_ETC2_RGB8_texture OES_compressed_ETC2_RGBA8_texture OES_compressed_ETC2_punchthroughA_RGBA8_texture OES_compressed_ETC2_punchthroughA_sRGB8_alpha_texture OES_compressed_ETC2_sRGB8_alpha8_texture OES_compressed_ETC2_sRGB8_texture
  • webgl1Extensions: ANGLE_instanced_arrays EXT_blend_minmax EXT_color_buffer_half_float EXT_disjoint_timer_query EXT_float_blend EXT_frag_depth EXT_shader_texture_lod EXT_sRGB EXT_texture_compression_bptc EXT_texture_filter_anisotropic OES_element_index_uint OES_standard_derivatives OES_texture_float OES_texture_float_linear OES_texture_half_float OES_texture_half_float_linear OES_vertex_array_object WEBGL_color_buffer_float WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_depth_texture WEBGL_draw_buffers WEBGL_lose_context
  • webgl1Renderer: Google Inc. -- ANGLE (Radeon RX 580 Series Direct3D11 vs_5_0 ps_5_0)
  • webgl1Version: OpenGL ES 2.0 (ANGLE 2.1.0.21dccd386996)
  • webgl1WSIInfo: EGL_VENDOR: Google Inc. (adapter LUID: 000000000000bc7b) EGL_VERSION: 1.4 (ANGLE 2.1.0.21dccd386996) EGL_EXTENSIONS: EGL_EXT_create_context_robustness EGL_ANGLE_d3d_share_handle_client_buffer EGL_ANGLE_d3d_texture_client_buffer EGL_ANGLE_surface_d3d_texture_2d_share_handle EGL_ANGLE_query_surface_pointer EGL_ANGLE_window_fixed_size EGL_ANGLE_keyed_mutex EGL_ANGLE_surface_orientation EGL_ANGLE_direct_composition EGL_NV_post_sub_buffer EGL_KHR_create_context EGL_EXT_device_query EGL_KHR_image EGL_KHR_image_base EGL_KHR_gl_texture_2D_image EGL_KHR_gl_texture_cubemap_image EGL_KHR_gl_renderbuffer_image EGL_KHR_get_all_proc_addresses EGL_KHR_stream EGL_KHR_stream_consumer_gltexture EGL_NV_stream_consumer_gltexture_yuv EGL_ANGLE_flexible_surface_compatibility EGL_ANGLE_stream_producer_d3d_texture EGL_ANGLE_create_context_webgl_compatibility EGL_CHROMIUM_create_context_bind_generates_resource EGL_CHROMIUM_sync_control EGL_EXT_pixel_format_float EGL_KHR_surfaceless_context EGL_ANGLE_display_texture_share_group EGL_ANGLE_create_context_client_arrays EGL_ANGLE_program_cache_control EGL_ANGLE_robust_resource_initialization EGL_ANGLE_create_context_extensions_enabled EGL_ANDROID_blob_cache EGL_ANDROID_recordable EGL_EXTENSIONS(nullptr): EGL_EXT_client_extensions EGL_EXT_platform_base EGL_EXT_platform_device EGL_ANGLE_platform_angle EGL_ANGLE_platform_angle_d3d EGL_ANGLE_device_creation EGL_ANGLE_device_creation_d3d11 EGL_ANGLE_experimental_present_path EGL_KHR_client_get_all_proc_addresses EGL_KHR_debug EGL_ANGLE_explicit_context
  • webgl2DriverExtensions: GL_ANGLE_client_arrays GL_ANGLE_copy_texture_3d GL_ANGLE_depth_texture GL_ANGLE_explicit_context GL_ANGLE_explicit_context_gles1 GL_ANGLE_framebuffer_blit GL_ANGLE_framebuffer_multisample GL_ANGLE_instanced_arrays GL_ANGLE_lossy_etc_decode GL_ANGLE_memory_size GL_ANGLE_multi_draw GL_ANGLE_multiview_multisample GL_ANGLE_pack_reverse_row_order GL_ANGLE_program_cache_control GL_ANGLE_provoking_vertex GL_ANGLE_request_extension GL_ANGLE_robust_client_memory GL_ANGLE_texture_compression_dxt3 GL_ANGLE_texture_compression_dxt5 GL_ANGLE_texture_multisample GL_ANGLE_texture_usage GL_ANGLE_translated_shader_source GL_CHROMIUM_bind_generates_resource GL_CHROMIUM_bind_uniform_location GL_CHROMIUM_color_buffer_float_rgb GL_CHROMIUM_color_buffer_float_rgba GL_CHROMIUM_copy_compressed_texture GL_CHROMIUM_copy_texture GL_CHROMIUM_sync_query GL_EXT_blend_func_extended GL_EXT_blend_minmax GL_EXT_color_buffer_float GL_EXT_color_buffer_half_float GL_EXT_debug_marker GL_EXT_discard_framebuffer GL_EXT_disjoint_timer_query GL_EXT_draw_buffers GL_EXT_float_blend GL_EXT_frag_depth GL_EXT_instanced_arrays GL_EXT_map_buffer_range GL_EXT_occlusion_query_boolean GL_EXT_read_format_bgra GL_EXT_robustness GL_EXT_sRGB GL_EXT_shader_texture_lod GL_EXT_texture_compression_bptc GL_EXT_texture_compression_dxt1 GL_EXT_texture_compression_s3tc_srgb GL_EXT_texture_filter_anisotropic GL_EXT_texture_format_BGRA8888 GL_EXT_texture_norm16 GL_EXT_texture_rg GL_EXT_texture_storage GL_EXT_unpack_subimage GL_KHR_debug GL_KHR_parallel_shader_compile GL_KHR_robust_buffer_access_behavior GL_NV_EGL_stream_consumer_external GL_NV_fence GL_NV_pack_subimage GL_NV_pixel_buffer_object GL_OES_EGL_image GL_OES_EGL_image_external GL_OES_EGL_image_external_essl3 GL_OES_compressed_ETC1_RGB8_texture GL_OES_depth32 GL_OES_element_index_uint GL_OES_get_program_binary GL_OES_mapbuffer GL_OES_packed_depth_stencil GL_OES_rgb8_rgba8 GL_OES_standard_derivatives GL_OES_surfaceless_context GL_OES_texture_border_clamp GL_OES_texture_float GL_OES_texture_float_linear GL_OES_texture_half_float GL_OES_texture_half_float_linear GL_OES_texture_npot GL_OES_vertex_array_object GL_OVR_multiview2 OES_compressed_EAC_R11_signed_texture OES_compressed_EAC_R11_unsigned_texture OES_compressed_EAC_RG11_signed_texture OES_compressed_EAC_RG11_unsigned_texture OES_compressed_ETC2_RGB8_texture OES_compressed_ETC2_RGBA8_texture OES_compressed_ETC2_punchthroughA_RGBA8_texture OES_compressed_ETC2_punchthroughA_sRGB8_alpha_texture OES_compressed_ETC2_sRGB8_alpha8_texture OES_compressed_ETC2_sRGB8_texture
  • webgl2Extensions: EXT_color_buffer_float EXT_disjoint_timer_query EXT_float_blend EXT_texture_compression_bptc EXT_texture_filter_anisotropic OES_texture_float_linear WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_lose_context
  • webgl2Renderer: Google Inc. -- ANGLE (Radeon RX 580 Series Direct3D11 vs_5_0 ps_5_0)
  • webgl2Version: OpenGL ES 3.0 (ANGLE 2.1.0.21dccd386996)
  • webgl2WSIInfo: EGL_VENDOR: Google Inc. (adapter LUID: 000000000000bc7b) EGL_VERSION: 1.4 (ANGLE 2.1.0.21dccd386996) EGL_EXTENSIONS: EGL_EXT_create_context_robustness EGL_ANGLE_d3d_share_handle_client_buffer EGL_ANGLE_d3d_texture_client_buffer EGL_ANGLE_surface_d3d_texture_2d_share_handle EGL_ANGLE_query_surface_pointer EGL_ANGLE_window_fixed_size EGL_ANGLE_keyed_mutex EGL_ANGLE_surface_orientation EGL_ANGLE_direct_composition EGL_NV_post_sub_buffer EGL_KHR_create_context EGL_EXT_device_query EGL_KHR_image EGL_KHR_image_base EGL_KHR_gl_texture_2D_image EGL_KHR_gl_texture_cubemap_image EGL_KHR_gl_renderbuffer_image EGL_KHR_get_all_proc_addresses EGL_KHR_stream EGL_KHR_stream_consumer_gltexture EGL_NV_stream_consumer_gltexture_yuv EGL_ANGLE_flexible_surface_compatibility EGL_ANGLE_stream_producer_d3d_texture EGL_ANGLE_create_context_webgl_compatibility EGL_CHROMIUM_create_context_bind_generates_resource EGL_CHROMIUM_sync_control EGL_EXT_pixel_format_float EGL_KHR_surfaceless_context EGL_ANGLE_display_texture_share_group EGL_ANGLE_create_context_client_arrays EGL_ANGLE_program_cache_control EGL_ANGLE_robust_resource_initialization EGL_ANGLE_create_context_extensions_enabled EGL_ANDROID_blob_cache EGL_ANDROID_recordable EGL_EXTENSIONS(nullptr): EGL_EXT_client_extensions EGL_EXT_platform_base EGL_EXT_platform_device EGL_ANGLE_platform_angle EGL_ANGLE_platform_angle_d3d EGL_ANGLE_device_creation EGL_ANGLE_device_creation_d3d11 EGL_ANGLE_experimental_present_path EGL_KHR_client_get_all_proc_addresses EGL_KHR_debug EGL_ANGLE_explicit_context
  • windowLayerManagerRemote: True
  • windowLayerManagerType: WebRender
  • windowUsingAdvancedLayers: False

Modified Preferences

Misc

  • User JS: No
  • Accessibility: No

Question owner

Also here are some additional screenshots of how it used to work before the update.

Also here are some additional screenshots of how it used to work before the update.
Was this helpful to you?
Quote
patrick 0 solutions 3 answers

I don't really know what the issue is here, but It may be related to the new rendering system on macOS. That is has been this way on your laptop is weird though. Did you try to reinstall Firefox on one of your devices?

I don't really know what the issue is here, but It may be related to the new rendering system on macOS. That is has been this way on your laptop is weird though. Did you try to reinstall Firefox on one of your devices?
Was this helpful to you? 0
Quote

Question owner

This issue occurs for me on both on Mac and Windows. Also if you look at the image in my second comment you can see how it should look (and used to). I have already reinstalled firefox.

This issue occurs for me on both on Mac and Windows. Also if you look at the image in my second comment you can see how it should look (and used to). I have already reinstalled firefox.
Was this helpful to you?
Quote
Hiruksha Deshan 0 solutions 5 answers

Add-on to change the default zoom level for all websites at once. ... This will help increase the size of web pages.

   1. To make things bigger, press Ctrl and + at the same time.
   2. To make things smaller, press Ctrl and - at the same time.
   3. To reset the size back to normal, press Ctrl and 0 at the same time.
Add-on to change the default zoom level for all websites at once. ... This will help increase the size of web pages. 1. To make things bigger, press Ctrl and + at the same time. 2. To make things smaller, press Ctrl and - at the same time. 3. To reset the size back to normal, press Ctrl and 0 at the same time.
Was this helpful to you? 0
Quote

Question owner

What? This has nothing to do with zooming the web page... The CSS on the Firefox homepage is broken. I am asking how I can fix it so elements properly rearrange when I change the size of my browser window. I have tried a clean install of firefox (deleted user profile and uninstalled) and the problem still persists. Maybe I am not using the right language to describe the issue.

What? This has nothing to do with zooming the web page... The CSS on the Firefox homepage is broken. I am asking how I can fix it so elements properly rearrange when I change the size of my browser window. I have tried a clean install of firefox (deleted user profile and uninstalled) and the problem still persists. Maybe I am not using the right language to describe the issue.
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8792 solutions 71906 answers

Chosen Solution

Hi Austin, the layout of the page changed. It previously had a design that could wrap Top Sites tiles to a new row based on the page width, and it now has a fixed width layout.

You could override this using custom style rules in a userContent.css file, but I haven't developed a complete recipe. To get the general idea, here are the variable width rules for the "main" tag adapted to the Top Sites section:

@media (min-width: 610px) {
	.discovery-stream.ds-layout {
		width: 530px !important; 
	} 
}
@media (min-width: 866px) {
	.discovery-stream.ds-layout {
		width: 786px !important; 
	} 
}
@media (min-width: 1122px) {
	.discovery-stream.ds-layout {
		width: 1042px !important; 
	} 
}

To see the effect, while on the new tab page, press Shift+F7 to open the Style Editor tool. Click the + button to add a new style sheet, then paste in those rules. As you reduce the width of the window, the number of tiles in each row of the Top Sites grid should be reduced to fit.

It's not pretty. Someone will need to work on finding the right widths to break at, and also how to deal with the search box.

Hi Austin, the layout of the page changed. It previously had a design that could wrap Top Sites tiles to a new row based on the page width, and it now has a fixed width layout. You could override this using custom style rules in a userContent.css file, but I haven't developed a complete recipe. To get the general idea, here are the variable width rules for the "main" tag adapted to the Top Sites section: <pre>@media (min-width: 610px) { .discovery-stream.ds-layout { width: 530px !important; } } @media (min-width: 866px) { .discovery-stream.ds-layout { width: 786px !important; } } @media (min-width: 1122px) { .discovery-stream.ds-layout { width: 1042px !important; } } </pre> To see the effect, while on the new tab page, press Shift+F7 to open the Style Editor tool. Click the + button to add a new style sheet, then paste in those rules. As you reduce the width of the window, the number of tiles in each row of the Top Sites grid should be reduced to fit. It's not pretty. Someone will need to work on finding the right widths to break at, and also how to deal with the search box.
Was this helpful to you? 1
Quote

Question owner

Oh wow so this was an intentional change? Thanks for the response. I will play around with my userContent.css until I can satisfy my needs.

Oh wow so this was an intentional change? Thanks for the response. I will play around with my userContent.css until I can satisfy my needs.
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.