Address not displayed properly in joomla - php

I have created a website named m2mreach.com , the site works well apart from having the bug in the contect us page "www.m2mreach.com/contact-us.html " the address is not showing up in this.. Here with i'm attaching the image of the bug . Kindly assist....
Thanks

This is the same question as this question but I'll answer this as it's slightly better formatted.
The data is present, it's just the margin and padding you have applied to address in your css. If you remove the margin and padding it shows.
If you set the margin to margin: 0 20px; the address shows.
I can see that the css that is causing this is from typography.php which is part of jckeditor. I think you just need to override the style on that element.
I'm not very good with css, but this one was easy to work out. I suggest you grab firebug for FireFox or use the tools in your browser (Chrome has dev tools too).

Related

I am getting horizontal scrolling responsive issue in WordPress

I am getting horizontal scrolling issue in iPhone. I developed a website in WordPress. and also it getting problem in mobile phone UC browser how can I fix the problem.
It will be hard to get a proper answer without looking at the site but what I usually do is use the component inspector from Chrome to locate any html elements that are created outside of the 320 px limit you have on iPhones and go from there.
Please provide more information.
However, as a dirty, quick fix, try:
body {
overflow-x:hidden;
}

A Wordpress specific way to "stretch", (min height) etc the content of my pages so that there are no whitespaces after my footers?

I have basic coding experience. In my Wordpress install, some of my pages have a blank whitespace under the footer because there is not enough content to push it to the bottom of the monitor at higher resolutions. The problem is persistent on chrome, Firefox, IE etc. I would like to fix this so that:
If the content is shorter than the browser resolution, the "body" will fill the page until the footer is at bottom of the screen with no blank whitespaces after or before it.
No matter what the browser resolution is there will be no whitespaces after the footer, so im trying to refrain from code that will use a determined "px" number.
I want the footer to be displayed in a traditional 'bottom' of the page way and NOT a sticky footer that always remains at the bottom of the screen no matter how far you scroll.
As I am working in Wordpress I have access to custom CSS and source theme files, however, I would prefer to solve this problem with custom CSS and an answer that acknowledges a Wordpress specific fix. I have tried several solutions but to no avail. I have been suggested to use Ryan Fiat's "Sticky Footer" solution but I'm unsure of how I would incorporate that into my Wordpress as it uses PHP and I mainly edit with custom CSS.
Heres a Fiddle of my footer PHP.
Q. Please provide me with a clear and direct solution for Wordpress that will make sure there are no whitespaces below the footers on my site when the content is shorter than the browser.
You can find an example of the whitespaces on my website here
Solutions i've tried:
#footer {overflow: hidden;} in the custom CSS didn't work.
Putting html, body, parentDiv, childDiv, section, footer { height : 100%; } in my custom css but that didn't work.
#copyright { padding-bottom: 20px;} "#copyright" is under the footer so this did reduce the whitespace to a point where it seemed it weren't present, but on taller browser windows the white space reappeared.
"div-wrapper, body" solutions like Ryan Fiat's seem to have positive responses but again I cant find a Wordpress specific one.
Answer from those that have experience with Wordpress are greatly appreciated.
I don't think there's a good pure CSS fix that isn't hacky in some way without changing how your page works (sticky footer or something).
Here are two options:
Use javascript to determine the height of the window, subtract the height of the footer, and force the content section to have a minimum of that height. You would also need to run this same function when the window is resized. This isn't a great solution.
What I would recommend is to just add the CSS rule body {background: #222} to make the body the same background as the footer. This way, if they content doesn't fill the whole window it just looks like the footer fills the empty space instead of white.

Browser scrollbar is nowhere to be found?

Okay basically for some reason, I barely noticed that when I load up my project the scrollbar is missing on all browsers, which is weird, i can force scroll by clicking down on the little mouse ball on my mouse. Although on internet explore that doesn't work at all.
I tried to retrace my steps after modifying my code to see what could have gone, but since i barely realized it, not very sure when it occurred. Thats why I can not provide a problematic code.
I'd appreciate it if someone could take a look at it for me.
Removed link Because answer is solved.
You have overflow:hidden on your html. If you change it to scroll, the scroll bar appears.
If you are wanting to stop horizontal scrolling, use overflow-x:hidden
your body has the following css.
#wrapper {
overflow: hidden;
This is causing the scroll bars to be hidden;

Content and footer space problems

I don't know why the space between the content-bottom and the footer is bigger than the space between header and content-top you can see an example here: [not found]. I want the same equal spacing for the content(that box) between header and footer...but always I get bigger spacing between content and footer..and I don't know how to fix it, please help me guys.
Best Regards
You have given your header, position:absolute and footer position:fixed. also height to middle container. This way your elements won't flow correctly.
My suggestion:
give header and footer position normal.
and give content:
.wrap {margin:100px auto; width:---px;}
Instead of using .css('height'), use .height() or .outerHeight() if you want to calculate also padding and margins of the element in question.
You can download the Firebug plugin (http://getfirebug.com/) if you have Firefox. Using this plugin, you can view the CSS of individual elements on the page by hovering over them and pressing ctrl+shift+c.
You may also view paddings, margins, and heights via the "Layout" tab as well as edit CSS and see updates immediately as live, local changes. That allows for rapid CSS debugging.

how to edit a wordpress theme background?

I have wordpress installed on my system. I am using twentyten theme, in the theme directory there is style.css file. In that file I tried
body {
background-color: red;
}
but nothing happens, no matter what change in style.css it does not reflects in browser.
Please help.
Have you cleared your browser's cache? Often the browser will cache the css files to be more efficient, so any changes you make to it require you to clear the cache.
If you're using a windows machine: ctrl + shift + del should bring up the clear cache dialog
Edit: it appears that your css was in the #media print section of the stylesheet - which only applies to printed material
The best way to figure this stuff out is to install Firebug in Firefox or use the built-in Inspector in Chrome.
Right-click on the page, do 'Inspect Element' and check what the Inspector tells you. Probably the background-color you're setting is being overruled by another style rule (Inspector will tell you this) or there are other elements with another background-color which are placed on top of the body, thus hiding the red background-color.
Either way, doing an 'Inspect Element' will make this clear. We can only guess from here.
First of all ensure that you're editing the right style sheet. For example try to erase all the styling code inside this file and refresh your website. If you loose your style then you're in the right place.
Second try to use Firebug Addon it will help you to inspect the html Element then you can show the corresponding CSS for this element. you can change whatever you want and see the effects directly on your page then you can write these changes to the style sheet.
hope it helps you.
Maybe that style is overwritten by another background attribute on the body a few lines below (browser will always render the last css attributes of elements). Something you can check easily with firebug.
If you have plugins, disable them just to be sure.
Other then that and the suggestions already made I'm not entirely sure what could cause this

Categories