adding margins to Fontfolio
-
My theme doesn’t have any margins (width is currently 0) using Chrome or Firefox. Margins are present in Safari, however. Why this is is unclear.
I checked the custom CSS I’ve added, and I don’t see anything that would affect the margins of the site. I removed the custom CSS to verify that my code did not change the theme’s margins.
This test revealed the theme has no margins, except in Safari.
How can add left and right margins (say 3px width), without ruining the theme and/or my custom CSS?
thanks for any help!
The theme I am using is Fontfolio.
The blog I need help with is: (visible only to logged in users)
-
btw the way the problem happens when you initially access the site using a large monitor and the browser open to the max.
if you shrink the browser, or refresh the site, the problem goes away (ie you start to get the margins you expect), even if the the browser is again maximized.
this has to be a bug in the theme…. or not?
-
I don’t see a difference between Firefox and Safari on your home page. Could you be a little clearer about what and where the difference is appearing (screenshots would help). Perhaps you mean borders rather than margins?
-
yes borders, if that is the correct technical term. i meant margin as the space between text and the vertical edge of page in a regular old fashioned typed page.
this only happens in the following situation: when i first fire up chrome, log in to wp, then access my site. if i resize chrome, the problem becomes less pronounced. this does not happen in chrome if i bring up the site, without signing in to wp.
it no longer seems to be happening in firefox or opera (i only sign it to wp using chrome). so is this is a wp sign in issue, maybe? it appears so, and thus not a priority issue if I only have to resize my chrome window to get rid of the problem.
however i am curious if one can modify the vertical borders for the entire site using css. just changing the left margins for .site-main and the #masthead separately doesn’t line up right.
here are the screen shots: in chrome, full screen, then resized.
by the way, halluke, I expect major compliments from you as to how I figured out to do animation using your idea for overlaying the pic on the grey rectangle — and it works with all 3 major browsers I care about. you might also want to admire the border around the tilted parrot, which was also a minor success!
-
by the way, I was surprised that Adblock Plus blocks css3 animations. i could not figure out why my scrolling canvas thing didn’t work on Chrome until I disabled that add-on for just my site.
-
I do like the border on the parrot image and well done on your CSS adventures!
Your site is set to a maximum width of 1122px on larger screens and I don’t see why this would change for different browsers unless your screen resolution is such that it’s right on the point where it crosses a @media responsive CSS boundary or where the viewport and site width perfectly match.
Attempting to make your site appear exactly the same on all sorts of different browsers/devices/OSes is a bit of a fools errand as there are so many different things to take into account. In general with CSS you want to try to give all viewers the best possible experience however they might be accessing your site and not worry too much about any one visitors experience being slightly different from anyone else’s.
Sorry I can’t do much else to help!
-
thank you for looking into this. it is not a priority. i would be interested, however, in knowing how to globally change the margins of the page, if there is a simple way to do this via CSS.
the other mystery was when i experimented by changing the scale transform to a translateX transform, and encountered major flickering. but that, too, is not a priority at the moment, so there is no urgency there. i tried the webkit fix, but it didnt work. something about not working on background images, is the info i gleaned on the internet.
i really like the animation from a practical perspective because it gives me the ability to (a) display merchandise in an eye-catching way, while (b) preventing the ability of end users to copy the images and duplicate the merchandise, which alas is a big big problem in my business.
again, many thanx!
- The topic ‘adding margins to Fontfolio’ is closed to new replies.