Apr 2020
1 / 5
Apr 2020
Jan 2021

Hi,

Hotglue pages do not scale to the size of browser window. The way a page is shown while editing is exactly how it will look. It is a "fixed layout" approach, which is one of Hotglue's features.

Danja

Hi Danja - thanks so much for your reply.
Will I need to fill the white space with content to get rid of it then?
There is no other way? Thanks for your thoughts.
Best Wishes. N.

hi nicsinghs,
as far as my knowledge goes :grimacing: :

be aware that this white space will be different in every screen you look.
so maybe you can look in different devices and then decide how would you like to change the layout and sizes of the content.

if you don't want to change the layout you can place a background tiled image and it will fill up all the empty space. (or other design based approaches).

also, if you want all the content of the page to be centered, then you could place this code in the < body > of your pages code ('add/edit custom code' button). i got it a few years ago from saba vidyo :floppy_disk: (i hope this is how you put code in this forum :sweat_smile: +i hope this code still works)

<script>!window.jQuery && document.write('<script  indent src="js/jquery-1.5.2.min.js"> <\/script>')</script>

<script type="text/javascript">
var l_sides = new Array();
var r_sides = new Array();
var win_width = $( window ).width();
var body_width = $( "body" ).width();
var objs_with_ids = $('body [id]');

objs_with_ids.each(function() { //Get elements that have an id=
  l_sides.push($(this).offset().left); //add left's to array
  r_sides.push($(this).offset().left + $(this).width()); //add right's to array
});

var min_left = l_sides[0];
var max_right = r_sides[0];

for (var i=1, len=l_sides.length; i < len; i++) {
   if(l_sides[i] < min_left) {min_left = l_sides[i]}
}
for (i=1, len=r_sides.length; i < len; i++) {
   if(r_sides[i] > max_right) {max_right = r_sides[i]}
}

var objs_grp_width = max_right - min_left;
var dist_to_move = win_width/2 - objs_grp_width/2;
//alert(dist_to_move);

objs_with_ids.each(function() { //Get elements that have an id=
    $(this).css('left', parseInt($(this).css('left')) + dist_to_move);
});
</script>

:warning: but then every time you are editing the page, you have to take all the content to the left side (otherwise the centering will not work properly) (ctrl+a selects all the content of the page :muscle:).

i myself love the fact that hotglue is absolute positioning, it makes so many thing possible and its a powerful and beautiful feature :wrench: :hibiscus:

9 months later

Hello, I have the same problem, there is no way to remove this white space on the right side of my screen ? or to see if there are transparent objects (which might explain it).??
Thank you,

Lucie