Inspiring

Question

text alignment in UL list

Forum|Forum|3 years ago
July 5, 2022
2 replies
383 views

I am having some problems with UL lists. I figured out how to code specific UL classes. The problem is, if the the line item is more than one line, the text floats to the left. Is there a way to align the text with the first line of the <li>?

Here is my class:

/*Mobile*/

@media (max-width: 380px){

ul.specifications-info {

list-style-type: none;

padding-top: 10px;

font-size: 1.5em;

padding-left: 10px;

margin-right: 10px;

font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;

margin-left: 10px;

text-align: left;

}

/*Tablet*/

@media (min-width:381px) and (max-width:949px){

ul.specifications-info {

list-style-type: none;

padding-top: 10px;

font-size: 1.4em;

padding-left: 10px;

margin-left: 10px;

margin-right: 10px;

font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;

text-align: left;

left: 0px;

list-style-position: inside;

}

/*Desktop*/

@media (min-width: 950px){

ul.specifications-info {

list-style-type: none;

padding-top: 10px;

font-size: 1.3em;

padding-left: 10px;

margin-left: 10px;

margin-right: 10px;

font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;

text-align: left;

}

Attached is what I'm getting:

This topic has been closed for replies.

O

osgood_

Brainiac

What does your actual code look like as I can't see anything in the css that you posted that would be causing the issue?

D

default0vaokg78cv42Author

Inspiring

<li>Detector: Air equivalent ion chamber. </li>

<li>Window: Light-tight 0.9 mg/cm2 Mylar laminate. 10 sq cm

area. 36 mm (1.4") dia. </li>

<li>Readout: LCD 8 digits </li>

<li>Indicator Light: Green LED 10 pulses/min per mR/h. </li>

<li>Red LED Over-range Indicator. </li>

<li>Range:</li>

<li>Rate 6 digits 0.01 mR/h to 100 mR/h in one range.</li>

<li>Integrate 6 digits 0.01 mR to 9.9R. </li>

<li>Photon Energy Range: 15 KeV - 500 KeV ± 20% </li>

<li>High Voltage: Fully user adjustable (internal pot). </li>

<li>X-Ray Rep Rate: Use either rate or integrate mode for pulses with

repetition rate of less than 1.0 Sec. </li>

<li>Use Integrate Mode for repetition rate less than 1.50 Sec. </li>

<li>Electrometer: Solid State MOSFET input. </li>

<li>Electronics: Adj H. V. Supply, Pulse Shaper. A-D converter LCD

drivers. Test and display functions. </li>

<li>Pulse Duration and Content:</li>

<li> With sufficient repetitions, TBM-XR and

TBM-EXR can accurately integrate pulses of less than a microsecond duration

and longer and including continuous emission. Pulse content of 0.5 nanoR are

measurable with sufficient repetition rate to give at least .01 mR/hr for at

least 5 to 10 seconds. </li>

<li>Environment: </li>

<li>Temperature of Operation from -20° to 50° C </li>

<li>Relative Humidity 0 - 95% </li>

<li>Radio-frequency 10 mW/cm2 up to 4 GHz affects meter viewing < ±

10% </li>

<li>Magnetic 200 Gauss ± 5% effect </li>

<li>Geotropism < ± 2% effect </li>

<li>Response Time: 2-3 seconds for rate and for integrate. </li>

<li>Time to Zero: If count-rate goes to zero, the digital display will

hold the old count for 12 seconds before displaying "0.0." </li>

<li>Batteries: Front panel battery test is provided.

6 ea. (AA) NEDA 15A - over 100 hrs of operation. </li>

<li>Dimensions:</li>

<li>5.5" x 3.5" (including handle) </li>

<li>Weight: TBM-IC-XRAY complete with batteries and internal detector:

2.4 lbs. </li>

<li>Options: </li>

<li>Readout in Si units nGy and nGy/h. </li>

<li>Ra-UBG - Check source. </li>

<li>Other entrance window material or thickness. </li>

<li>High voltage test button. </li>

<li>5 cm nylon positioning bumpers. </li>

</ul>

BenPleysier

Community Expert

Using this CSS

/*Mobile*/
body {
    margin: 20px;
}
ul.specifications-info {
    list-style-type: none;
    padding: 0;
    font-size: 1.5em;
    font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
}
/*Tablet*/
@media (min-width:381px) {
    ul.specifications-info {
        font-size: 1.4em;
    }
}
/*Desktop*/
@media (min-width: 950px){
    ul.specifications-info {
        font-size: 1.3em;
    }
}

I get