[Resolved] Footer: Aligning Labels horizontally

Home Forums Support [Resolved] Footer: Aligning Labels horizontally

Home Forums Support Footer: Aligning Labels horizontally

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #528479
    Kevin

    Hi,

    I’m trying to align 3 Labels on the footer:
    HTML:

    <p><br>
    	<span>	
    		<label><span onclick="toggleGoogle Analytics()"class="gaan checked">AN</span></label>
    		<label><span onclick="toggleGoogle Analytics()"class="gaaus">AUS</span></label>
    		<label><span class="gatxt">Google Analytics</span></label>
    	</span>
    </p>

    CSS:

    .gaan:hover {
            background:#42AE49; 
            border: 1px solid #42AE49; 
            color:#FFFFFF
        }
                    
        .gaaus:hover {
            background:#E84838; 
            border: 1px solid #E84838; 
            color:#FFFFFF;
        }
    
        .gaan, .gaaus { 
            font-size:0.8em;
            color:#FFF;
            display: inline-block;
            border: 1px solid #FFFFFF;
            padding:0em 0.5em;
            margin-right:5px;
            text-align:center;
            cursor:pointer;
            border: 1px solid #777777; 
            color:#777777
        }
        .gatxt{font-size:0.8em;color:#FFF;}
        .checked.gaan{
            background:#42AE49; 
            border: 1px solid #42AE49; 
            color:#FFFFFF
        }
        .checked.gaaus{
            background:#E84838;
            border: 1px solid #E84838; 
            color:#FFFFFF;
        }

    How do I get the labels to all align horizontally next to each other?

    Thanks!

    GeneratePress 2.0.2
    GP Premium 1.6
    #528658
    Leo
    Staff
    Customer Support

    Hi there,

    Not quite sure if I understand.

    So you want all three in the same line? If so it doesn’t work if you put them in one <p> or <div>?

    #528826
    Kevin

    Hi Leo,

    Yes .. all 3 on horizontally next to each other.
    It doesn’t seem to work if I put them in one <p> or <div>.

    Here is an example of a site that has it correctly > goo.gl/qVUrSE

    #528845
    Tom
    Lead Developer
    Lead Developer

    If you add your first code into an HTML widget, it should work automatically.

    It looks like it’s being added to a text widget right now, which adds paragraph and <br> elements.

    #528857
    Kevin

    Thanks! That worked perfectly.

    #528878
    Tom
    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.